如何在 wix react-native-navigation 中使用 pop 传递参数？答案

【问题标题】：How to pass the parameter with pop in wix react-native-navigation?如何在 wix react-native-navigation 中使用 pop 传递参数？
【发布时间】：2019-12-10 08:24:31
【问题描述】：

如何在pop方法中传递参数。

要求：有两个屏幕，屏幕 1 有两个类似这样的选项卡：地址和帐单。每个选项卡布局上有两个按钮。单击按钮后，功能返回屏幕 1 后转到屏幕 2，但现在哪个选项卡处于活动状态。如果转到地址选项卡，则返回与计费选项卡相同的地址选项卡。

告诉我怎么做？

【问题讨论】：

如何实现标签功能。你有没有使用像“react-native-tab-view”这样的包？
是的，我用过这个包。

标签： react-native wix-react-native-navigation

【解决方案1】：

你可以像推屏一样传递回调

Navigation.push(this.props.componentId, {
  component: {
    name: "Your.ScreenName",
    options: {
      callback:this.yourCallBackFun
    }
  }
});

现在当 pop 你可以像这样调用那个函数

this.props.callback();
Navigation.pop(this.props.componentId);

我想它会对你有所帮助。

【讨论】：

【解决方案2】：

屏幕 A：

this.props.navigation.navigate('ScreenB', {func: this.func});
...
func = value => {
  console.log(value);
}

屏幕 B：

this.props.navigation.getParam('func')();

你可以像这样调用 ScreenA 函数。

【讨论】：

【解决方案3】：

屏幕 1：

在您的第一个屏幕中编写您的导航函数和回调函数。将回调函数作为导航参数传白推屏。

const cbFunction = () => new Promise((resolve) => {
  resolve();
});

const navigation = () => {
  const { componentId } = this.props;
  Navigation.push(componentId, {
    component: {
      name: `SCREEN_NAME`,
      options: {
        cbFunction: this.cbFunction
      }
    }
  });
}

屏幕2：

编写一个返回第一个屏幕的函数。并从导航参数调用回调函数。

const goBack = async () => {
  const { cbFunction, componentId } = this.props;
  await cbFunction();
  Navigation.pop(componentId);
}

【讨论】：