使用 express 更新 MongoDB 中的 userData答案

【问题标题】：Update userData in MongoDB with express使用 express 更新 MongoDB 中的 userData
【发布时间】：2018-10-29 02:20:02
【问题描述】：

大家好，我尝试为我的应用创建更新功能，但最后出现错误提示 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 表单的向导表单

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)

【问题讨论】：

标签： javascript express react-native redux redux-thunk

【解决方案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());
  };
}

【讨论】：