Question

嗨大家好我尝试为我的应用创建一个更新功能，但我最终得到的错误是getState is not a function. (In 'getState()','getState' is 'Stephanson')，这是lastName值。

我将在后端发送来自Authentication_controller.js的更新控制器

// Update user data
exports.update = function (req, res, next) {
  res.json({ data: req.user });
}

这是我的路由器也来自后端

router.route('/users/:user_id/data')
  .put(requireAuth, AuthenticationController.update);

从userActions.js

更新操作

export function updateUserData(dispatch, getState) {
  const state = getState();
  const {user_id, token} = state.auth;
    return axios.put(USER_DATA(user_id), {
      headers: { authorization: token }
    }).then((response) => {
      console.log('my data = ' + response.data.data.userData[0].firstName);
      dispatch(setUserData(response.data.data.userData[0]));
    }).catch((err) => {
      dispatch(console.log("Couldn't update user data."));
    });
}

export var setUserData = (userData) => {
  return {
    type: 'SET_USER_DATA',
    userData
  }
}

这是我的userDatareducer.js

module.exports = (state = [], action) => {
  switch (action.type) {
    case 'SET_USER_DATA':
      return action.userData;

    case 'UPDATE_USER_DATA':
      return action.userData;

    default:
      return state;
  }
}

这是我的FullName.js页面，我正在使用redux表单中的Wizard Form

const onSubmit = (values, dispatch) => {
    console.log(values);
    const firstName = values.firstName;
    const lastName = values.lastName;
    dispatch(updateUserData(firstName, lastName));
};
const FullName = props => {
    const { handleSubmit } = props;
    return (
        <View style={{ flex: 1 }}>
            <ScrollView style={{ backgroundColor: '#ffffff' }}>
                <View style={{ flex: 1, flexDirection: 'column', marginTop: 0, margin: 40 }}>
                    <Text style={{ fontSize: 40, marginTop: 60 }}>Full Name</Text>
                    <Text style={{ fontSize: 20, marginTop: 10 }}>Can you please tell your name?</Text>
                    <View style={{ marginTop: 100 }}>
                        <Field keyboardType='default' label='First Name' component={renderFieldFn} name='firstName' />
                        <Field keyboardType='default' label='Last Name' component={renderFieldLn} name='lastName' />
                    </View>
                </View>
            </ScrollView>
            <TouchableHighlight onPress={handleSubmit(onSubmit)} style={{ backgroundColor: 'white', padding: 20, alignItems: 'center' }}>
                <Text style={{
                    backgroundColor: 'black', color: 'white', fontSize: 20, fontWeight: 'bold',
                    height: 50, width: 300, textAlign: 'center', padding: 14
                }}>NEXT</Text>
            </TouchableHighlight>
        </View>
    );
}
export default reduxForm({
    form: 'newUser',
    destroyOnUnmount: false,
    forceUnregisterOnUnmount: true,
    validate
})(FullName)

Answer 1

在userActions.js中，尝试更改

export function updateUserData(dispatch, getState) {

到

export const updateUserData = (firstName, lastName) => (dispatch, getState) => {

由于redux-thunk返回一个创建动作的函数，上面的内容类似于documentation中的这个例子：

function incrementIfOdd() {
  return (dispatch, getState) => {
    const { counter } = getState();

    if (counter % 2 === 0) {
      return;
    }

    dispatch(increment());
  };
}

使用express更新MongoDB中的userData

1 个答案: