Question

所以，我有这样的层次结构：

MyList ---＆gt; MyListNav

MyList是一个包含我的东西列表的屏幕; MyListNav StackNavigator被Modal包裹，以便在按下Add New Stuff屏幕上的MyList按钮时弹出一个小窗口。

作为StackNavigator，MyListNav有两个屏幕：

export default class Test extends Component {

    constructor(props){
        super(props)
        this.state = {
          isVisible: false
          }

        FVN = StackNavigator({
          Find: {screen: Find},
          Add: {screen: Add},
        },{
          mode: 'card',
          headerMode: 'none',
          cardStyle: {
            opacity: 1,
            backgroundColor: 'transparent',
          },
          // ...some transitioning configurations
        })
    }

    render() {
      return(
        <Modal
         isVisible={this.props.isVisible} avoidKeyboard>
         <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
           <View style={styles.modal}>
             <FVN screenProps = {{isVisible: false}}/>
           </View>
         </TouchableWithoutFeedback>
        </Modal>
      )
    }

我知道这不是一种常见的做法，但我需要这样做，因为这是我在模态中导航的唯一方法，而我正在为iPad做这个。

对于Find和Add，他们都有一个自定义CLOSE按钮来关闭MyListNav模式。

现在的问题是，我知道如何将参数从MyListNav（子）传递给MyList（父），并使用MyList中的状态来控制{MyListNav的可见性1}}。但我无法找到将道具或状态Find或Add传递给MyListNav的方法。或者说，我找不到将CLOSE按钮按到MyListNav的方法，正如我所尝试的那样，似乎是Find / Add之间的关系并且MyListNav不是子节点和父节点，因此不能使用回调函数来执行此操作。

这有什么常规解决方案吗？或者我在某个地方弄错了？

Answer 1

当您想要将道具传递给屏幕时，

react-navigation有点受限。

如果您未使用redux，则您的选项相当有限。

您可以做的是通过您已在此处执行的screenProps将导航初始化的组件中的道具传递到您的屏幕：<FVN screenProps = {{isVisible: false}}/>。

在Find和Add屏幕中，您还应该能够看到/访问isVisible道具。

所以你可以这样做：

<FVN screenProps = { { isVisible: false, findProps: {}, addProps: {} } }/>

希望这有帮助

如何将道具传递给导航器？

1 个答案: