Question

我无法在自定义标记标注中显示图像（来自资产和网络）：标注中的图像始终显示为空白矩形。

class CustomCalloutView extends React.Component {

    render() {
        return (

            <View>
                <View>
                    <Text style={{
                        fontWeight: "bold",
                    }}>
                        Test
                </Text>
                </View>
                <View>
                    <Image
                        source={{ uri: 'https://facebook.github.io/react/logo-og.png' }}
                        style={{ width: 100, height: 100 }}
                    />
                </View>
            </View>

        )
    }
}

主要的Map组件是：

<MapView
    style={{ flex: 1 }}
    initialRegion={{
        latitude: 37.78825,
        longitude: -122.4324,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421,
    }}>
    {this.state.markers.map(marker => (
        <Marker
            key={marker.id}
            coordinate={marker.latlng}>
            <Callout>
                <CustomCalloutView />
            </Callout>
        </Marker>
    ))}
</MapView>);

标记已正确显示，并且标注已呈现，但未显示图像。如果我在普通视图中使用同一张图片，就可以使用。

我正在使用expo（expo.io），但还尝试了模拟器并在设备上安装了APK（Android；没有有关ios的信息）。

Answer 1

在“文字”组件中使用“图像”。像这样：

<Text>
<Image style={{ height: 100, width:100 }} source={{ ... }} resizeMode="cover" />
</Text>

反应本地地图和带有图像的标注

1 个答案: