一些自定义标记不会出现在 Android react-native-maps答案

【问题标题】：Some custom markers do not appear on Android react-native-maps一些自定义标记不会出现在 Android react-native-maps
【发布时间】：2019-03-26 19:27:57
【问题描述】：

在我们的应用程序中，我们正在获取用户登录时的位置（单击登录 -> 获取位置 -> 在 redux 中保存位置 -> 导航到主屏幕）。当 Home 组件挂载时，它应该使用位置从用户周围区域获取数据。

在 iOS 中，所有标记都正确呈现，但在 Android 设备中，并非所有标记都被呈现，只有其中一些（奇怪的是它们都是 image1 或 image2）。

只有当我们再次调用 getDataFromRegion 函数时，所有标记才能正确呈现。知道我们做错了什么吗？

class Login extends Component {

   handleLogin = (u, p) => {

      getLocation(location => {

         let region = {
            latitude: location.coords.latitude,
            longitude: location.coords.longitude,
            latitudeDelta: 0.06,
            longitudeDelta: 0.06
         }

         /* save location in redux */
         this.props.setLocation(region)
         login(u, p).then(() => _gotoHome())
      })
   }
}

class Home extends Component {

    componentWillMount() {

       if(this.props.location !== undefined) {

           initialRegion = {
               latitude: this.props.location.latitude,
               longitude: this.props.location.longitude,
               latitudeDelta: 0.06,
               longitudeDelta: 0.06
            }
        }
     }

     componentDidMount() {
        /* set data in redux */   
           this.getDataFromRegion(initialRegion)
     }

     render() {
        this.props.data.map((data, index) => data.visible ? <CustomMarker key={index} data={data}/> : null)
        }
     }


class CustomMarker extends Component {
     render() {
         const {data} = this.props
         const coords = { latitude: data.lat, longitude: data.lng }

         return (

             <MapView.Marker
                 coordinate={coords}
                 onLoad={() => this.forceUpdate()}
                 tracksViewChanges={Platform.OS === 'android' ? false : true}
             >
                 <Image 
                    onLoad={() => this.forceUpdate()} 
                    source={data.a === '0' ? image1 : image2}
                    style={{width: 60, height: 60}}
                 />
             </MapView.Marker>
         )
     }
}

【问题讨论】：

标签： android react-native react-native-maps

【解决方案1】：

似乎删除 Image 组件并使用 MapView.Marker 道具 image 让它工作。此外，在 MapView 内渲染具有 opacity: 0 的虚拟 MapView.Marker 解决了在第一次渲染调用时出现默认标记的问题。

【讨论】：