首页 > 解决方案 > 在 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>

标签: javascriptreact-nativeparametersexporeact-navigation-v5

解决方案


我不知道你为什么要制作这些函数,但函数总是正确的,所以它不会工作

const didComeFromNextScreen = () => route.params
const didComeFromOtherScreen = () => route.params

更新到

const didComeFromNextScreen = route.params
const didComeFromOtherScreen = route.params

推荐阅读