Reactjs 如何动态更新MapboxGL.ShapeSource？

使用，当

符号层

动态添加到

形状资源

时，它似乎没有显示，或者

形状资源

没有更新

下面是要重现的示例：基于，我用下面的代码替换了代码。要复制，只需在

CustomIcon.js

示例中复制粘贴代码以替代现有代码即可

从“React”导入React；
从“react native”导入{View，Text}；
从“@react native mapbox gl/maps”导入MapboxGL；
从“../styles/sheet”导入图纸；
从“./common/BaseExamplePropTypes”导入BaseExamplePropTypes；
从“./common/Page”导入页面；
从“./common/Bubble”导入气泡；
常量样式={
图标：{
I:是的，
},
视图：{
宽度：60，
身高：60，
边框颜色：“黑色”，
边框宽度：1，
对齐项目：“居中”，
为内容辩护：“中心”
},
正文：{
尺码：50
}
};
const customIcons=['关于该主题的全部讨论如下：

简而言之：我想将dynamics SVG用作
symbolayer
（例如，这样我可以更改颜色），但这是不可能的：给
symbolayer
任何子组件都不是正确的方法

相反，我们需要将
图像
与
形状资源
和
符号层
并行使用，因为
图像
可以动态更新

下面是一个代码示例：

从“React”导入React；
从“@react native mapbox gl/maps”导入MapboxGL；
常量myImages={
“image-1”：“path/to/image-1”，
'image-2'：'path/to/image-2'
}
常量createFeature=（{
showPin，
icon='image-1'，//只要任何添加的功能具有属于静态myImages的图标，它就可以工作。
协调，
身份证件
}) => ({
// https://github.com/react-native-mapbox-gl/maps/blob/master/docs/ShapeSource.md ->形状资源支柱
// https://geojson.org
//这是一个geoJSON形状
键入：“功能”，
身份证件
特性：{
showPin，
偶像
},
几何图形：{
键入：“点”，
协调，
}
})
类MyReact.Component{
状态={
featureCollection:MapboxGL.geoUtils.makeFeatureCollection（），
}
componentDidMount（）{
this.updateFeatures（）
}
componentDidUpdate（prevProps）{
//根据任何条件更新功能
if（conditionProps（prevProps，this.props））this.updateFeatures（）
}
updateFeatures（）{
const featureCollection=MapboxGL.geoUtils.makeFeatureCollection（）
for（让此.props.features的特性）{
MapboxGL.geoUtils.addToFeatureCollection(
特色收藏，
createFeature（特征）
)
}
this.setState（{featureCollection}）；
}
onPress=（e）=>{
const feature=e.nativeEvent.payload；
此.props.doAnythingWithPressedFeature（feature）；
}
render（）{
返回(
)
}
}
导出默认标记；