加载新元素时保持地图以标记为中心

问题描述

我正在加载一个包含来自选定地图标记信息的模式。我通过保存所选标记的状态并将其传递给模式中的组件以显示来自该特定标记的信息来实现此目的。因此，标记未聚焦，地图会快速返回其起始位置（在许多情况下，是用户的位置）。

有没有办法以一种不会将地图重置为默认位置的方式来保持焦点或以某种方式加载模态？

这是一个片段：

<View style={styles.mapView}>
        <MapView
          style={styles.mapView}
          showsUserLocation={true}
          showsMyLocationButton={true}
          region={{
            latitude: latitude,longitude: longitude,latitudeDelta: latitudeDelta,longitudeDelta: longitudeDelta,}}>
          {
            (markerArr = data.map((listing,index) => (
              <CustomMarker
                key={index}
                image={listing.pin}
                point={listing.point}
                category={listing.categoryID}
                place={listing.place}
                onPress={() => {
                  markerpressed(listing);
                }}
                coordinate={{
                  latitude: listing.latitude,longitude: listing.longitude,}}
              />
            )))
          }
        </MapView>
        <Modal
          style={{ position: 'absolute',bottom: 10 }}
          animationType="slide"
          transparent={true}
          visible={modalVisible}
          onRequestClose={() => {
            setModalVisible(!modalVisible);
          }}
          setModalVisiblity={() => {
            setModalVisible((preState) => (preState = !preState));
          }}>
          <TouchableOpacity
            style={styles.containerT}
            activeOpacity={1}
            onPressOut={() => {
              setModalVisible(false);
            }}>
            <ScrollView
              directionalLockEnabled={true}
              contentContainerStyle={{ position: 'absolute',bottom: 35 }}>
              <TouchableWithoutFeedback>
                <View>
                  <TouchableOpacity
                    onPress={() => {
                      onPressListingItem(selectedMarker);
                      setModalVisible(false);
                    }}>
                    <MapListing
                      // key={index}
                      name={selectedMarker.title}
                      image={selectedMarker.pin}
                      point={selectedMarker.point}
                      photo={selectedMarker.photo}
                      category={selectedMarker.categoryID}
                      description={selectedMarker.description}
                      place={selectedMarker.place}
                      link={() => {
                        markerLink(selectedMarker);
                      }}
                    />
                  </TouchableOpacity>
                </View>
              </TouchableWithoutFeedback>
            </ScrollView>
          </TouchableOpacity>
        </Modal>
      </View>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）