Reactjs 如何在加载时打开React Native Maps标记的详图索引

我希望在安装屏幕组件时打开所有标记的所有标注。目前，它仅在单击标记时打开。如何在功能组件中使用useRef来实现这一点

const markerRef = useRef(React.createRef)

return (
    <View style={styles.container}>
        <MapView 
            style={{ flex: 1 }} 
            region={region}
            onRegionChangeComplete={onRegionChangeComplete}
        >
            {data && data.posts.map(marker => (
                <Marker
                    ref={markerRef}
                    key={marker.id}
                    coordinate={{latitude: marker.latitude, longitude: marker.longitude }}    
                >
                    <Callout>
                        <Text>{marker.title}</Text>
                        <Text>{JSON.stringify(marker.price)}</Text>
                    </Callout>
                </Marker>
            ))}
        </MapView>
        <View style={styles.inputContainer}> 
            <Icon name="magnify" size={30} color="lightgrey" />
            <TextInput 
                placeholder="Search Term"
                style={styles.input}
                onChangeText={setSearch}
                value={search}
                returnKeyType="search"
                onSubmitEditing={handleSubmit}
            />
        </View>
    </View>

常量markerRef=useRef（React.createRef） 返回( {data&&data.posts.map（marker=>( {marker.title} {JSON.stringify（marker.price）} ))}

---

当I

console.log（markerRef.current）

时，它不提供

showCallout（）

方法。

最干净的方法是创建自己的视图作为标记。

您可以看到标记的示例。 这里有一个例子

这只是一个开始。你可以在标记上放置自己的单击处理程序并隐藏它

因此，这可能不太理想，但可能会起到黑客的作用。 从渲染函数开始

renderCallout() {
    if(this.state.calloutIsRendered === true) return;
    this.setState({calloutIsRendered: true});
    this.markerRef.showCallout();
}

然后将其添加到onRegionChangeComplete事件中

<MapView
  onRegionChangeComplete={() => this.renderCallout()}
  ...
>

this.renderCallout（）}
...
>

谢谢，但实际上我正试图在功能组件中使用

useRef

。我似乎无法使用钩子访问

showCallout（）

方法。我遇到了一个错误“无法读取未定义的属性showCallout”。