回调函数中的 navigator.pop() 形式的 redux 操作答案

【问题标题】：navigator.pop() in callback function form redux action回调函数中的 navigator.pop() 形式的 redux 操作
【发布时间】：2017-12-14 18:20:08
【问题描述】：

我正在实现一个小应用程序，我需要在firebase中插入一些数据，然后在数据插入完成后从堆栈中弹出屏幕。

我现在正在调用该动作，并传递一个回调函数以在插入数据后执行，我的代码如下：

EmployeeCreate.js

onButtonPress() {
    const { name, phone, shift, navigator } = this.props;
    this.props.employeeCreate({ name, phone, shift: shift || 'Monday' }, () => {
        console.log('REDIRECT FUNCTION HERE');
        navigator.pop({
        animated: true, // does the pop have transition animation or does it happen immediately (optional)
        animationType: 'fade', // 'fade' (for both) / 'slide-horizontal' (for android) does the pop have different transition animation (optional)
        });
    });
}

EmployeeActions.js

export const employeeCreate = ({ name, phone, shift }, callbackFunction) => {
  const { currentUser } = firebase.auth();
  return () => {
    firebase.database().ref(`/users/${currentUser.uid}/employees`)
    .push({ name, phone, shift })
    .then(callbackFunction);
    //type: EMPLOYEE_CREATE
  };
};

该操作现在没有通过减速器，并且该应用程序似乎运行良好。我只是想知道我是否做得正确，或者是否有更好的方法可以达到相同的结果？

【问题讨论】：

标签： javascript firebase react-native react-redux react-native-navigation

【解决方案1】：

因为您的employeeCreate 函数看起来像一个异步操作，所以异步操作如下所示：

function testAsync(arg1, arg2) {
  return (dispatch) => {
    // dispatch(...)
    fetch(...)
    .then(result => {
      // dispatch(...)
    })
  }
}

你只是没有在employeeCreate中调用dispatch。

【讨论】：

谢谢@Jacky。实际上我的问题更多的是关于良好实践，我的代码有效，我现在正在使用 dispatch 方法。
我对同一件事很好奇，即最佳实践是什么。我没有使用传递给动作创建者的回调函数，而是直接将“this.props.navigation”传递给导航器并从那里调用它。传递 this.props.navigation 和传递回调函数这两种解决方案都有效，但我很好奇推荐的方法是什么以及为什么。

【解决方案2】：

here 讨论的另一个可能的解决方案是创建一个 NavigationActions 类，您可以将其包含在任何非组件中，从而在您的操作创建者中使用以进行导航。听起来更好的解决方案正在开发中，但尚不清楚何时发布。

【讨论】：