react-native - react-native-maps 标记抛出和 IndexOutofBoundsException: Invalid index 1, size is 0

Question

我正在尝试让 react-native-maps Marker 显示在我的 Android 设备上（它在 iOS 上工作得非常好），但它向我抛出了 IndexOutofBoundsException: Invalid index 1, size is 0 error at render time。

http://i.imgur.com/owletnw.png

render() {
    const INITIAL_REGION = { latitude: 52.221835, longitude: 21.000896, latitudeDelta: 0.0922, longitudeDelta: 0.0421 };
    return (
        <MapView ref="map"
            showsUserLocation = { true }
            loadingEnabled = { true }
            showsTraffic = { false }
            showsBuildings = { false }
            style = { styles.map, {flex: 1} }
            initialRegion = { INITIAL_REGION }
        >
            <View style={{flex: 0.1, flexDirection: 'row', position: 'absolute', justifyContent: 'space-between', backgroundColor: 'transparent'}}>
                <Button onPress={() => this.showWithinRadius(5)}>Wszystkie ~5km</Button>
                <Button onPress={() => this.showWithinRadius(10)}>Wszystkie ~10km</Button>
                <Button onPress={() => this.showWithinRadius(15)}>Wszystkie ~15km</Button>
                <Button onPress={() => this.showAllOffers()}>Wszystkie oferty</Button>
            </View>
            { console.log(this.state.offerLocation) }
            <Marker
                coordinate = { {latitude: 52.259216308593, longitude: 21.041564941406} }
                title = { this.props.selectedOffer.offer.title }
            />
        </MapView>
    );
}

知道什么可能导致这种行为吗？我尝试从 MapView 组件中删除 View 块，但这似乎没有帮助。在实际的应用程序中，我计划通过一个似乎在 fitToCoordinates 方法中工作的对象传递坐标。

Answer 1

没有为这个问题提供解决方案，但它帮助我理解并修复了我的问题。我认为问题不是View问题，而是组件的呈现顺序。看起来，在 Android 上，渲染顺序很重要。所以，为我修复它的Markers第一个孩子。MapView

这里也提到了： https ://github.com/react-community/react-native-maps/issues/291

希望我能帮上忙！

Answer 2

Nevermind, it was in fact the View component inside the MapView that was causing the issue.

Answer 3

将内部视图和市场放在一个视图中，这样就解决了问题。

Answer 4

对我来说，解决方案是删除任何视图（可以是视图、图像等）。它与对象无关，也与订单无关。