Question

这只是一个问题，我想仔细检查一下我做得对不对。我来自不同框架的年龄，我想在早期阶段避免不良做法。

我正在使用此样板：https://github.com/erikras/react-redux-universal-hot-example 我在ES7写作。

我创建了： - 1 reducer：earlyUser.js - 1个容器：landingPage.js - 1个组件：registrationForm.js

在landingPage中，我以这种方式包含reducer中的方法：

从'redux / modules / earlyUser'导入{saveEmail，savePreferences，checkEmailExists};

我宣布了一些句柄

 handleSubmitEmail(data) {
    this.props.saveEmail(data);
 }

 handleSubmitPreferences(data) {
    //some data manipulation
    this.props.savePreferences(data);
 }

在JSX部分我只是将处理程序传递给我的组件：

<registrationForm submitEmail= {::this.handleSubmit}   etc... >

现在在组件内部，我将表单提交链接到此处理程序：

submitEmail() {
    if (this.validateEmail(this.state.email)) {
      this.props.submitEmailHandler(this.state);
    }
  }

现在我的问题是，我应该在哪里附上承诺的.then和.catch？理想情况下，我想在component.js中做类似

的事情

this.props.submitEmailHandler(this.state).then( function emailRegisterCallback(){
   // move to next step
}).catch( function errorHandler(error){
  // there was an error
}

这是对的吗？

此外，是否有正确的语法来处理ES7中的承诺？

Answer 1

您通常会在动作创建者中处理异步方面：

请参阅async redux example：

中的此代码

function fetchPosts(reddit) {
  return dispatch => {
    dispatch(requestPosts(reddit));
    return fetch(`http://www.reddit.com/r/${reddit}.json`)
      .then(response => response.json())
      .then(json => dispatch(receivePosts(reddit, json)));
  };
}

当promise解析时，您应该发送另一个操作来更新成功结果或错误的状态。

我正确使用Redux吗？

1 个答案: