用例: 从FlatList中,单击一项,转到“详细信息”页面。
Wind绕说明: 我有一个屏幕,我不想出现在“选项卡”或“抽屉”菜单中(不需要在导航栏上有一个项目),但是除非将项目添加到“抽屉”或“选项卡导航器”中,否则我将无法导航至该项目页面。
如果我确实将它们添加到“选项卡”或“抽屉导航器”中,则该路径有效。
export default class Items extends React.Component {
state = {
loading: false,
data: json_data.features,
error: null,
}
Navigate_To_Item = (item) => {
// This works without Navigator present
console.log(item)
// This only works if I have Item in my Drawer or Tab Nav
this.props.navigation.navigate('Item', {item});
}
render() {
return (
<SafeAreaView style={styles.container}>
<Text style={styles.headline}>List of Items</Text>
<FlatList
data={this.state.data}
renderItem={({ item }) =>
<TouchableWithoutFeedback
onPress={() => this.Navigate_To_Item(item)} >
<View style={styles.listContainer}>
<Text style={styles.item}>{item.properties.name</Text>
<Text style={styles.land}>{item.properties.descrption}</Text>
</View>
</TouchableWithoutFeedback>
}
/>
</SafeAreaView>
)
}
}
我可以共享我的“抽屉”和“选项卡”导航器,但是如果我添加Item,它们也可以正常工作,但是我不希望Item显示在菜单中。
为此花了几个小时,我很困惑。感谢您的协助!
答案 0 :(得分:1)
在您的
Navigate_To_Item = (item) => {
// This works without Navigator present
console.log(item)
// This only works if I have Item in my Drawer or Tab Nav
this.props.navigation.navigate('Item', {item});
}
导航指向哪条路线?您可能有一个Stacknavigator,其中有2个屏幕-您的标签/抽屉导航器和Itemscreen。您可以发送带有screenProps的导航器,以便仍可以在Tab / Drawer导航器中访问Stacknavigator。
检查SO-thread中的答案,您可能理解我的意思。