找不到变量:尝试从堆栈导航器内部导航时出现导航错误 [英] Can’t find variable: navigation error when trying to navigate inside from inside the stack navigator
本文介绍了找不到变量:尝试从堆栈导航器内部导航时出现导航错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我添加了一个标题按钮,当我点击该按钮时,我想转到应用程序中的特定屏幕,代码如下:
I've added a header button and I'd like to go to a specific screen in my app when I click on that button, here's the code:
function ActionBarIcon(props) {
return (
<TouchableOpacity onPress={props.onPress}>
<Image
source={{uri : 'https://static.thenounproject.com/png/261370-200.png'}}
style={{ width: 30, height: 30, marginRight : 15 }} />
</TouchableOpacity>
);
}
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator initialRouteName="Orders">
<Stack.Screen name="Orders" component={HomePage} options = {{
headerRight : props => <ActionBarIcon {...props}
onPress={() => {
navigation.navigate('Create Order')
}} />
}}/>
<Stack.Screen name="Order Details" component={DetailsPage} />
<Stack.Screen name="Create Order" component={CreateOrderPage} />
</Stack.Navigator>
</NavigationContainer>
);
}
如您所见,我想创建订单页面,当单击标题按钮时,我收到一条错误消息,提示找不到变量:导航".感谢您的反馈!
As you can see, I want to go to create order page, when the header button is clicked but I'm getting an error saying "Can’t find variable: navigation". I appreciate your feedback!
推荐答案
在 headerRight 中一定不能获取导航,所以你可以试试下面的建议
It must not be getting navigation inside headerRight, so you may try the below suggestion
<Stack.Screen name="Orders" component={HomePage} options={({ navigation, route }) => ({
headerRight: props => <ActionBarIcon {...props}
onPress={() => {
navigation.navigate('Create Order')
}} />
})}
/>
这篇关于找不到变量:尝试从堆栈导航器内部导航时出现导航错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文