3

我在我的 React-Native 应用程序中使用动态移动标记,为了使标记移动,我在一个间隔上进行了状态更新,用新的标记位置重新渲染屏幕。我也在尝试使用 react-native-maps-directions 它使用 google Routes API(需要花钱),我不能让路由 API 每秒被调用两次,因为这看起来很浪费(也因为我较差的)。

基本上,您是否知道一种方法可以继续重新渲染更新标记位置的部分而不重新渲染路线

这是我的渲染:

render() {
    return (
      <View>
          <MapView
            allOfMyProps={blahblahProps}
          >

            //This currently does and should re-render every time because I need them to move
            {this.state.markers[1] !== null &&
              this.state.markers.map((marker, index) => (
                <MapView.Marker
                  key={index}
                  coordinate={{
                    latitude: marker.coordinate.latitude,
                    longitude: marker.coordinate.longitude,
                  }}
                />
              ))}

            /// This is what renders the route, I want this to not re-render every time state changes
          <MapViewDirections
              origin={origin}
              destination={destination}
              apikey={GOOGLE_MAPS_API_KEY} //configure this right
              strokeWidth={10}
              strokeColor="green"
           />


          </MapView>
    </View>
4

1 回答 1

0

我通过创建一个新的基于外部类的组件并使用另一个 shouldComponentUpdate 来测试目标道具是否更新来解决它。如果它更新了,则重新渲染组件,如果没有,它将发回它已经渲染的内容。非常感谢 Drew Reese 的提示!

于 2020-12-30T03:54:28.747 回答