javascript - 在 React Native 中向堆栈导航器添加 if 语句
问题描述
我有一个“聊天”屏幕,可以从我的 React Native App 中的多个屏幕访问。我正在尝试添加带有“route.params”的“if 语句”?到堆栈导航器,因此它将根据用户的来源将用户导航回正确的屏幕,但我无法执行“if语句”。
下面是我的代码:
function MainTabScreen ({ navigation, route }){
const didComeFromNextScreen = () => route.params
const didComeFromOtherScreen = () => route.params
const chatChecker = ()=>{
if(route.params?.didComeFromNextScreen){
console.log('It came from NextScreen')
navigation.navigate('NextScreen')
return;
}
if(route.params?.didComeFromOtherScreen){
console.log('It came from OtherScreen')
navigation.navigate('OtherScreen')
return;
}
}
<MainTab.Navigator screenOptions ={{
headerStyle:{
backgroundColor:"#fff" ,
},
gestureEnabled: false,
headerTintColor: 'red',
headerTitleStyle: {
fontWeight: 'bold',
fontSize: height*0.023,
textAlign: 'center',
}
}}
>
<MainTab.Screen name = "NextScreen" component={NextScreen} options= {{
title: '' ,
headerTintColor: '#fff',
headerLeft: null,
headerRight: () => (
<Icon.Button name = "message" size={25} backgroundColor= "#fff" onPress={ () => navigation.navigate('ChatScreen',{
didComeFromNextScreen: true
})}>
</Icon.Button>
}}
/>
<MainTab.Screen name = "ChatScreen" component={ChatScreen} options= {{
title: '' ,
headerTintColor: '#fff',
headerLeft: ()=>(
<Icon.Button name = "arrow-left" size={25} backgroundColor= "#fff" onPress={chatChecker}/>
)
}}
/>
<MainTab.Screen name = "OtherScreen" component={OtherScreen} options= {{
title: '' ,
headerTintColor: '#fff',
headerLeft: null,
headerRight: () => (
onPress={ () => navigation.navigate('ChatScreen',{
didComeFromOtherScreen: true
})}>
}}
/>
</MainTab.Navigator>
解决方案
我不知道你为什么要制作这些函数,但函数总是正确的,所以它不会工作
const didComeFromNextScreen = () => route.params
const didComeFromOtherScreen = () => route.params
更新到
const didComeFromNextScreen = route.params
const didComeFromOtherScreen = route.params
推荐阅读
- typescript - 在行动中检测到不可序列化的值
- javascript - React JavaScript 导入别名
- node.js - 无法设置未定义的属性“区域设置”,不能在 replit 中工作,但在我的电脑上
- javascript - 我如何在java脚本中获取上一个事件目标
- python - 在 tensorflow 中冻结层会节省模型更新时间吗?
- rust - 如何一般地调用方法 f
() 在任何一个上 在锈? - avl-tree - 在 AVL 树中查找特定值下的键
- c - clang 格式的二元运算符后的间距
- android - Flutter - 用户卸载时删除所有数据(iOS /Android)
- android - Facebook 聊天插件可以在 React Native 应用程序中使用吗?