Question

目标是重复使用具有不同内容的同一屏幕ui，并且仍然能够使用react native处理向后导航（例如reddit应用如何在您单击它们时显示多个用户/订阅源屏幕，但仍能处理自定义向后导航）导航v2？

尝试使用动态屏幕ID并在状态变量中使用它们。我对这种方法还没有走很远。

内置的后退按钮可处理后退导航，但请考虑以下情形：

我正在处理一个表单，然后打开另一个表单，对其进行处理，保存并必须返回到现有表单。自定义处理程序不允许这样做。

代码：

主屏幕：

Navigation.push(this.props.componentId, {
  component: {
    name: 'example.formScreen',
    passProps: {
      data: some props
    },
    options: {
      topBar: {
        title: {
          text: 'form Screen'
        }
      }
    }
  }
});

在表单屏幕中：

<View>
<Button 
title="save form"
onpress = ()=>{
Navigation.push(this.props.componentId, {
      component: {
        name: 'example.formScreen',
        passProps: {
          data: some other props
        },
        options: {
          topBar: {
            title: {
              text: 'form Screen'
            }
          }
        }
      }
    });
}/>
<Button
title="go back"
onPress={()=>Navigation.pop(this.props.componentID)}
/>
</View>

Answer 1

在导航到屏幕时，您必须将参数和导航路线一起传递，这些参数将具有有助于填充新屏幕上内容的数据。这是在react native导航v2中传递参数的示例，后退按钮的功能与您可以弹出的前一条路线将导航的功能相同。

Navigation.push(this.props.componentId, {
  component: {
    name: "ShowAnotherScreen",
    passProps: {
     data: item
    }
  }
})

Answer 2

如果要转到同一屏幕并传递参数，请尝试在当前屏幕上再次呈现当前屏幕。

this.props.navigation.push('currentscreen',{param: "params"})

如何使用React Native Navigation v2多次打开具有不同内容的同一屏幕？

2 个答案: