Обновите определенное состояние в Redux с помощью редуктора - PullRequest
Новая
       10

Обновите определенное состояние в Redux с помощью редуктора

0 голосов
/ 04 марта 2019

Я хотел бы знать, как я могу обновить определенное значение в состоянии.У меня есть моя конфигурация состояния, и я хотел бы обновить значение 'offset' без изменения предела или общего значения, просто установите новое смещение с помощью this.props.setParams () ...

С помощью этой функцииЯ хотел бы изменить смещение this.props.setParams ({offset: 10}) или ограничить this.props.setParams ({limit: 40}) и т. Д., Просто отправив параметры и изменив непосредственно связанное состояние.

searchList.js 

this.props.setParams({ offset: 10})

actions-search.js 

export function setFilters(newFilters) {
    return {
        type   : SEARCH.SET_NEW_FILTERS,
        payload: newFilters
    };
}

export function setParams(newParams) {
    return {
        type   : SEARCH.SET_NEW_PARAMS,
        payload: newParams
    };
}

редуктор-поиск.js 

...

    /*State : CONFIG*/
    /*config: {
        filters : {
            ...
        }
        params: {
            offset: 0,
            limit: 25,
            total: 100
        }
    }*/

case SEARCH.SET_NEW_FILTERS :
    let newFilters = action.payload;

    return {
        ...state,
        config: {
            ...state.config,
            filters : {
                ...state.config.filters,
                newFilters
            }
            params : {
                ...state.config.params
            }
        }
    };
case SEARCH.SET_NEW_PARAMS :
    let newParams = action.payload; // {offset: 10}

    return {
        ...state,
        config: {
            ...state.config,
            filters : {
                ...state.config.filters
            }
            params : {
                ...state.config.params,
                newParams
            }
        }
    };
....

Конечно, я должен написать это: 

return {
    ...state,
    config: {
        ...state.config,
        params : {
            ...state.config.params,
            offset : newParams.offset
        }
    }
};

Как я могу иметь более "универсальный" в моем редукторе?Не указывать конкретное свойство, но оно более глобально.

Просто отправьте объект "params" в моем создателе действий, например: this.props.setParams ({offset: 30, total: 120})?

1 Ответ

0 голосов
/ 04 марта 2019

Фактическое поведение

Ваш код добавляет newFilters и newParams в качестве свойств.Таким образом, вам нужно будет получить доступ к offset как: 

state.config.params.newParams.offset

Решение

Чтобы получить доступ к этим новым фильтрам или параметрам напрямую с помощью 

state.config.params.offset

Вы должны распространять newFilters и newParams, используя синтаксис ..., в ваших редукторах: 

            filters : {
                ...state.config.filters,
                ...newFilters
            }

и 

            params : {
                ...state.config.params,
                ...newParams
            }

Синтаксис распространения добавит (или заменит) внутренние свойства вашей полезной нагрузки, newFilters и newParams, к свойствам state.config.filters и state.config.params соответственно.

Улучшения

Чтобы упростить ваш редуктор, вы можете распространить action.payload напрямую и удалить некоторые, вероятно, ненужные спреды:

actions-search.js 

...

case SEARCH.SET_NEW_FILTERS :
    return {
        ...state,
        config: {
            ...state.config,
            filters : {
                ...state.config.filters,
                ...action.payload
            }
        }
    };
case SEARCH.SET_NEW_PARAMS :
    return {
        ...state,
        config: {
            ...state.config,
            params : {
                ...state.config.params,
                ...action.payload
            }
        }
    };
...
...