HarmonyOS 关于Provide数据传递问题咨询

Consulting description:特殊类型的属性如何不通过props传递，封装地图组件的时候，在父容器组件中定义：

@Provide map?: map.MapComponentController = undefined 
aboutToAppear(): void { 
  this.mapCallback = async (err, mapController) => { 
    if (!err) { 
      this.map = mapController; 
    } 
  } 
}

然后在子组件中使用@Consume map?: map.MapComponentController接收，运行实例的时候app会直接闪退，有没有更好的解决方式

Scenario:封装地图控件，希望最终使用方式如下：

Map({...}){ 
  Marker({...}) 
  Circle({...}) 
}

由于在marker里面需要调用map.addMarker(options)，不希望所有的map都通过props传递下去，有什么更好的解决方案。

HarmonyOS

FengTianYa

2024-08-09 15:51:25

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

问题解决方案如下：

// Demo 
import { Map } from './map' 
@Entry 
@Component 
export struct Demo { 
  // 地图初始化参数 
  build() { 
    Column(){ 
      Map({ 
        options: { 
          position: { 
            target: { 
              latitude: 31.985019, 
              longitude: 118.765998 
            }, 
            zoom: 14 
          }, 
          scaleControlsEnabled: true 
        } 
      }) 
    } 
  } 
}
// Map 
import { map, mapCommon, MapComponent } from '@kit.MapKit'; 
import { AsyncCallback } from '@kit.BasicServicesKit'; 
import {MapMarker} from './Marker' 
@Entry 
@Component 
export struct Map { 
  // 地图初始化参数 
  options?: mapCommon.MapOptions; 
  // 地图初始化回调 
  callback?: AsyncCallback<map.MapComponentController>; 
  @Provide map?: map.MapComponentController = undefined 
  @BuilderParam closer: () => void; 
  build() { 
    Column() { 
      Column() { 
        MapMarker({ 
          MarkerOptions: { 
            position: { 
              latitude: 31.985019, 
              longitude: 118.765998 
            }, 
            rotation: 0, 
            visible: true, 
            zIndex: 0, 
            alpha: 1, 
            anchorU: 0.5, 
            anchorV: 1, 
            clickable: true, 
            draggable: true, 
            flat: false 
          }, 
          MapOptions:this.options 
        }) 
      } 
    }.width('100%').height('100%').backgroundColor('#ff9008') 
  } 
}
// Maker 
import { map, mapCommon, MapComponent } from '@kit.MapKit'; 
import { AsyncCallback } from '@kit.BasicServicesKit'; 
@Component 
export struct MapMarker { 
  @Consume map?: map.MapComponentController; 
  private mapCallback?: AsyncCallback<map.MapComponentController>; 
  MapOptions?: mapCommon.MapOptions; 
  // Marker初始化参数 
  MarkerOptions?: mapCommon.MarkerOptions; 
  callback?: AsyncCallback<map.MapComponentController>; 
  async aboutToAppear() { 
    this.mapCallback = async (err, mapController) => { 
      if (!err) { 
        this.map = mapController; 
        console.log('this.map'+JSON.stringify(this.map)) 
        this.callback?.(err, mapController) 
      } 
    } 
    build() { 
      MapComponent({ mapOptions: this.MapOptions, mapCallback: this.mapCallback }).width('100%').height('100%') 
    } 
  }

2024-08-09 18:56:04

如何写精华回答，获更多曝光？

发布

51CTO

51CTO博客

51CTO学堂

HarmonyOS 关于Provide数据传递问题咨询

订阅鸿蒙技术特刊，精选内容抢先看