javascript - ownProps缺少通过mapStateToProps添加的 Prop

我有以下表格:

let NoteForm = ({handleSave}) => {
  return (
    <form onSubmit={handleSave}>
      <Field component="input" type="text" name="body" />
      <button type="submit">Submit</button>
    </form>
  )
}

和:

const mapStateToProps = (state, ownProps) => {
  return {
    isNew: state.isNew
  }
}

最后:

const mapDispatchToProps = (dispatch, ownProps) => {
  return {
    handleSave: () => {
      dispatch(saveNote(ownProps)) // ownProps does not contain "isNew" prop
    }
  }
}

isNew不包含prop ownProps。我希望这是我在这里犯的一个明显错误，无法看到它。

呈现NoteForm的组件是Note，并有条件地将其呈现为:
{ (isNew || isEdit) && <NoteForm /> }
我当然可以将 Prop 作为属性传递，但由于无法理解为什么我的 Prop 丢失，因此我很固执。我已经尝试过将它作为参数传递给我的组件:{handleSave, isNew}，但这也不起作用。

供引用，我的连接是:

NoteForm = connect(
  mapStateToProps,
  mapDispatchToProps
)(NoteForm);

最佳答案

目前，我无法对此进行测试，但是ownProps是传递给connect(...)(YourComponent)返回的组件的属性是有意义的。另一方面，isNew由YourComponent直接传递给mapStateToProps，因此您无法在mapDispatchToProps回调中访问它。

在您应用的某处...

const ReturnedComponent = connect(...)(YourComponent)

render () {

  <ReturnedComponent {...ownProps} />
}

这些ownProps可以通过mapStateToProps访问，但不能通过mapDispatchToProps传递。

查看由redux的创建者本人推荐的问题here的可能解决方案。

关于javascript - ownProps缺少通过mapStateToProps添加的 Prop ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40868692/