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

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

@Provide map?: map.MapComponentController = undefined 
aboutToAppear(): void { 
  this.mapCallback = async (err, mapController) => { 
    if (!err) { 
      this.map = mapController; 
    } 
  } 
}1.
2.
3.
4.
5.
6.
7.
8.

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

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

Map({...}){ 
  Marker({...}) 
  Circle({...}) 
}1.
2.
3.
4.

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

HarmonyOS

FengTianYa

2024-08-09 15:51:25

浏览

回答 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%') 
    } 
  }1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.

2024-08-09 18:56:04

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

发布

51CTO

51CTO博客

51CTO学堂

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

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