react native - react-native-maps 在 iOS 上的性能很慢

Question

這是我第一次使用react-native-maps在 iOS 上集成谷歌地圖。 我可以通過此鏈接中的逐步操作在 iOS 上顯示 Google 地圖：

在 iOS 上使用 Google Maps react-native-maps

然后，新的問題出現了，地圖的性能很糟糕（我不能移動地圖）。

更新

這是我的代碼：

該區域將保存在以下狀態：

constructor(props) {
    super(props);

    this.state = {
        region: {
            latitude: 10.762622,
            longitude: 106.660172,
            latitudeDelta: 0.0100,
            longitudeDelta: 0.0100,
        },
    }
}

這是顯示地圖的代碼：

render() {
    return (
        <View style={styles.container}>
            <View
                style={styles.mapContainer}>
                <MapView
                    provider={PROVIDER_GOOGLE}
                    style={styles.map}
                    region={this.state.region}
                    showsUserLocation={true}
                    onRegionChangeComplete={this.onRegionChangeComplete.bind(this)}
                >
                </MapView>
            </View>
        </View>
    )
}

onRegionChangeComplete(region) {
    console.log("region", region);
    this.setState({region: region});
}

這些代碼在 Android 上運行良好，但我無法在 iOS 上移動地圖

如果您有解決此問題的任何想法，請告訴我。 先感謝您！

Answer 1

所以，我不喜歡代碼的一些事情，我認為可能會打擾你：

1. 在 iOS 中使用 Google Provider：是否已安裝？ 工作正常嗎？ 我通常使用默認的 iOS 地圖，因為我猜是更優化。
2. 您在 onRegionChange 中使用 console.log() 可以執行很多次。 我在調試中遇到了一些 iOS 性能問題，因為我在渲染方法中使用了很多 console.log()，這會減慢模擬器的速度。
3. 該區域似乎指向該州的一個區域，並且您在移動時再次更新該區域。

所以，我會試試這個：

• 刪除 console.log 或確保在 XCode 中沒有記錄很多。
• 在地圖中將 region 替換為 initialRegion。 沒有必要繼續更新它。 如果需要，只需將其保存在另一個變量中。
• 刪除 provider 道具以查看常規 iOS MapKit 是否有效。

另外，請記住 MapView 有一些道具可以實際禁用滾動，但我假設您已經嘗試過。