【问题标题】:reducer does not update state in react reduxreducer 不会在 react redux 中更新状态
【发布时间】:2019-07-18 14:37:03
【问题描述】:

我正在尝试使用 react-redux 更新状态,但状态没有被更新。 新价值即将到来 “如果(action.type === 'SET_LOGGED_IN')” 在 reducer 中,但不将 isLoggedIn 更新为 true。 哪里错了? find the code

Login.js

function handleLoginClick(username, password, e) {
    e.preventDefault();

    post('/createUser', { username, password })
        .then(({ status }) => {
            if (status === 200) {
                console.log(this.props);
                this.props.setLoggedIn(true);
                this.props.history.push('/');
            }else{
                this.props.setLoggedIn(false);

            }
        })
        .catch(error => {
        .........
        })
}
..................
const mapStateToProps = state => {
    return {isLoggedIn : state.reducer.isLoggedIn};};
const mapDispatchToProps = dispatch => {
    return {setLoggedIn : (value) => dispatch({type: 'SET_LOGGED_IN', value: value}),}};

export default compose(
    withStyles(styles),
    withRouter,
    connect(mapStateToProps, mapDispatchToProps)
)(NewLogin);

reducer.js

import { combineReducers } from 'redux';
import { reducer as reduxFormReducer } from 'redux-form';

const initialStates = {
    isLoggedIn : false
};

const reducers = combineReducers({
    reducer : (state = initialStates, action) => {
        //console.log(action);
        if (action.type === 'SET_LOGGED_IN') {
            //console.log(action);
            return {
                ...state,
                isLoggedIn: action.value
            };
        }
        return state;
    },

        form: reduxFormReducer, // mounted under "form"
});

export default reducers;

【问题讨论】:

  • 你在哪里发货?
  • 请分享mapStateToProps函数
  • 在我的 Login.js 文件中,请检查'mapDispatchToProps'
  • 也请分享mapStateToPropsmapDispatchToProps正在添加功能。
  • @VladimirBogomolov 添加了codesandbox.io/s/148rm8qy9q

标签: javascript reactjs redux react-redux redux-form


【解决方案1】:

-修复了错误-

在我的代码中,状态已正确更新。当我访问时,我使用了未定义的 state.isLoggedIn。我从 state.reducer.isLoggedIn 中替换了它。 现在一切正常。

感谢@UmairFarooq、@VladimirBogomolov 以及所有评论并尝试修复它的人。

const mapStateToProps = state => {
    return {
      isLoggedIn : state.reducer.isLoggedIn
    };
};

【讨论】:

    【解决方案2】:

    认为您的mapStateToProps 可能有问题。尝试访问您的 isLoggedIn 状态,例如:

    const mapStateToProps = state => {
        return {isLoggedIn : state.isLoggedIn};};
    

    【讨论】:

      【解决方案3】:

      使用 componentwillupdate() 来控制何时更新 返回 false 不更新

      【讨论】:

        【解决方案4】:

        你应该以不同的方式调用 dispatch:

        const mapDispatchToProps = (dispatch, val) => {
          return {
            setLoggedIn : (val) => dispatch({ type: 'SET_LOGGED_IN', value: val }),
          }
        };
        

        试试吧,它应该适合你。

        【讨论】:

        • (dispatch, val)中定义的'val'不能在setLoggedIn中使用。
        猜你喜欢
        • 2021-01-08
        • 2017-08-08
        • 1970-01-01
        • 1970-01-01
        • 2019-07-28
        • 2018-04-29
        • 2020-10-21
        • 2018-08-04
        • 1970-01-01
        相关资源
        最近更新 更多