React / Redux:TypeError:无法读取未定义的属性“目标”

时间:2018-08-29 20:06:28

标签: javascript reactjs forms redux react-redux

我正在尝试使用某个用户(firstNamelastNameemail)的编辑字段来更新状态(用户列表)。这个想法是,只要用户更改表单中输入的值,就会触发创建者操作,以使用新值更新状态下的用户对象。下面是我的代码段:

在我的reducers.js中:

case actionCreators.changeUserValues.getType():
return {
...state,
usersList: [
  ...state.usersList.map((user) => {
    if (user.username === action.payload.username) {
      return {
        ...user,
        [action.payload.name]: action.payload.value,
      };
    }
    return user;
  }),
],
editButtonDisabled: false,
submitButtonDisabled: true,
selectedUserProfile: {
  userObject: {
    ...state.selectedUserProfile.userObject,
    [action.payload.name]: action.payload.value,
  },
},
};

actionCreators.js文件中:

const changeUserValues = createAction(CHANGE_USER_VALUES, userData => userData);

const onValueChange = event => (dispatch, getState) => {
  const { value, name } = event.target;
  const { username } = getState().selectedUserProfile.username;
  return dispatch(changeUserValues({ name, value, username }));
};

在我的容器中:

const mapDispatchToProps = dispatch => ({
  // some stuff
  onValueChange: () => dispatch(actionCreators.onValueChange()),
});

要测试我的代码,请编辑表单,然后在TypeError: Cannot read property 'target' of undefined actionCreator代码中收到此错误onValueChange()。我不知道如何粘贴/捕获event(因为我正在尝试'redux'this

1 个答案:

答案 0 :(得分:2)

您没有将事件传递给减速器

const mapDispatchToProps = dispatch => ({
  // some stuff
  onValueChange: (event) => dispatch(actionCreators.onValueChange(event)),
});

要获得更完整的答案,请在使用输入值时传递事件。只要mapDispatchToProps中也有值,它就应该一直到您的操作/归约器。

<input onChange={e=>this.props.onValueChange(e)} />