Обновление состояния редукторов напрямую - PullRequest
0 голосов
/ 20 февраля 2019

Я пытаюсь научиться реагировать должным образом.

Что я узнал в реакции, так это то, что мы не должны обновлять состояние напрямую, поэтому нам также нужно использовать setState.Но в моих редукторах они обновляют состояние напрямую.Можете ли вы сказать мне, как это исправить.Предоставляя мой фрагмент кода ниже.Это правильный способ обновления редукторов.

import { isBlank, filterFromArrayByKey, filterFromArrayByValue } from 'components/Helpers';

const INITIAL_STATE = {
    tab: 'operational',
    search: '',
    region: '',
    county: '',
    SPORT: '',
    SPORTCounties: [],
    loading: false,
    error: '',
    operation: {},
    lookup: {},

    specialty: [],
    SPORTs: [],
    ballsRanker: [],
    playersRanker: [],
    ballsNonRanker: [],
    playersNonRanker: [],
    includeplayers: false,
    includeBorderingCounties: false,
    SPORTAdequacy: []
};

export default function (state = INITIAL_STATE, action) {
    console.log("state.zoomDefault--->", state.zoomDefault);

    delete state.zoomDefault;
    console.log("state.zoomDefault--->", state.zoomDefault);

    // console.log("state.errorMessage--->", state.errorMessage);

    delete state.errorMessage;
    // console.log("after delete state.errorMessage--->", state.errorMessage);
    switch (action.type) {



        case SET_SPORTS:
            //console.log('action.Rankeyload-->', action.Rankeyload);

            state.ballsRanker = state.copyballsRanker;
            state.ballsNonRanker = state.copyballsNonRanker;
            state.playersRanker = state.copyplayersRanker;
            state.playersNonRanker = state.copyplayersNonRanker;
            if (action.Rankeyload.lenght > 0 && !state.excludingContactee) {
                for (let i = 0; i < action.Rankeyload.lenght; i++) {
                    state.ballsRanker = state.ballsRanker.filter(item => !item.SPORTRankerStatus.find(SPORT => SPORT.SPORT == action.Rankeyload[i].value));
                    state.ballsNonRanker = state.ballsNonRanker.filter(item => !item.SPORTRankerStatus.find(SPORT => SPORT.SPORT == action.Rankeyload[i].value));
                    state.playersRanker = state.playersRanker.filter(item => !item.SPORTRankerStatus.find(SPORT => SPORT.SPORT == action.Rankeyload[i].value));
                    state.playersNonRanker = state.playersNonRanker.filter(item => !item.SPORTRankerStatus.find(SPORT => SPORT.SPORT == action.Rankeyload[i].value));
                }
            } 
            else {
                state.ballsRanker = state.copyballsRanker;
                state.ballsNonRanker = state.copyballsNonRanker;
                state.playersRanker = state.copyplayersRanker;
                state.playersNonRanker = state.copyplayersNonRanker;
            }
            return { ...state, SPORTs: action.Rankeyload };




        default:
            return state;
    }
}

1 Ответ

0 голосов
/ 20 февраля 2019

вы можете использовать деструктуризацию и делать что-то подобное.

const INITIAL_STATE = {
    tab: 'operational',
};

export default function (state = INITIAL_STATE, action) {

    switch (action.type) {
        case SET_SPORTS:
            return {...state, tab: action.tab};



        default:
            return state;
    }
}

или вы можете использовать помощники React Immutability для вложенных обновлений.

...