0

我对这段代码有点困惑，我有两个屏幕，MainScreen在FeedScreen里面NativeStackNavigator，initialScreenName（将首先路由/渲染的屏幕）在哪里MainScreen。

我有一个嵌套在里面的MainScreen模态，在模态里面有一个按钮可以导航到FeedScreen，在导航到 时FeedScreen，Modal是可见的，但在返回时MainScreen，Modal不再可见，甚至在单击“显示模态”按钮后无法打开...

可见Modal性由state变量控制，这也是正确的，但仍然Modal不可见......

请指出这里发生了什么，因为根据我的说法，从...Modal回来时应该是开放的MainScreenFeedScreen

这是代码...

function MainScreen({navigation}){

const [modalVisibility, setModalVisibility] = useState(false)

return <View>
          <Text style={{ fontSize: 25 }}>I'm Main Screen...</Text>
          <Text>{String(modalVisibility)}</Text>
          <Button title='Show Modal' onPress={()=>setModalVisibility(true)} ></Button>

          <Modal visible={modalVisibility} onRequestClose={()=>setModalVisibility(false)}>
            <Text>I'm modal with visiblility {String(modalVisibility)}</Text>
            <Button title='Go to Feed' onPress={()=>navigation.navigate('FeedScreen')}/> 
          </Modal>
      </View>

}

function FeedScreen({navigation}) {
return <View>
      <Button title='Go to Main' onPress={()=>navigation.navigate("MainScreen")}></Button>
  </View>
}

function RootStackScreen() {
return (
<NavigationContainer>
  <RootStack.Navigator initialRouteName='MainScreen'>

      <RootStack.Screen name="MainScreen" component={MainScreen}/>
      <RootStack.Screen name="FeedScreen" component={FeedScreen}/>

  </RootStack.Navigator>
</NavigationContainer>
4

1 回答 1

0

问题是 modalVisibility 状态没有为 FeedScreen 公开，这意味着 feedscreen 无法访问该状态，您可以使用 [context provider] [1] 向它公开该状态。

[1]: https://reactjs.org/docs/context.html
于 2022-01-09T08:35:32.620 回答