Question

在下面的示例中，我使用mapDispatchToProps将onSubmit事件绑定到save() Action Creator。这有效 - save() Action Creator将消息记录到控制台。

问题在于它后来不会调度'TEST_SAVE'动作 - 即减速器永远不会收到'TEST_SAVE'类型的动作。

我有一个vanilla redux表单，如下所示，但我是redux-form的新手，我想知道我可能做错了什么？

const reducers = {
  // ... your other reducers here ...
  form: formReducer.plugin({
    contact: (state, action) => {  
      switch(action.type) {
        case 'TEST_SAVE':
          return state;
        default:
          return state;
      }
    }
  })
};
const reducer = combineReducers(reducers);
const store = createStore(reducer);


function mapDispatchToProps(dispatch) {
  return {
    onSubmit: (val) => dispatch(actionCreators.save(val)),
  }
}

var actionCreators = {   
  save: (value) => {
    console.log('SAVE action done!');
    return {type: 'TEST_SAVE', value};
  }, 
};

const MyContactForm = connect(
  mapDispatchToProps
)(ContactForm)


<Provider store={store}>
    <MyContactForm />
</Provider>

ContactForm类的摘录：

class ContactForm extends Component {

  render() {
    const { error, handleSubmit, pristine, reset, submitting } = this.props;

    return (
      <form
        onSubmit={handleSubmit}
        >

    ....

    )

  }
}

ContactForm = reduxForm({
  form: 'contact' 
})(ContactForm);

Answer 1

切勿在减速机内使用break。始终返回状态对象。

Answer 2

const MyContactForm = connect(
  mapDispatchToProps
)(ContactForm)

connect()的第一个参数是mapStateToProps，而不是mapDispatchToProps。应该是：

const MyContactForm = connect(
  undefined, // <------------- mapStateToProps
  mapDispatchToProps
)(ContactForm)

Redux-Form调度调用Action Creator，但reducer从不接收Action

2 个答案: