Передать значения в качестве параметров состояния от компонента или получить доступ к состоянию в создателе действия?

reactjs redux redux-thunk

489 просмотра

1 ответ

36 Репутация автора

В моем проекте у меня есть создатель действия, который зависит от значений, которые находятся в состоянии приложения, чтобы сгенерировать новое значение или решить, какое действие отправить. Мой вопрос состоит в том, чтобы знать, какой правильный способ сделать это. Я думал о двух способах. Получите доступ к этим значениям в создателе действия:

export const changePreviousPage = () => {
    return (dispatch, getState) => {
        let pagination = getState().appReducers.availability.pagination;

        let previousPage = pagination.actualPage != 1 ? pagination.actualPage - 1 : pagination.actualPage;
        dispatch({
            type: types.CHANGE_PREVIOUS_PAGE,
            previousPage
        });  
    }
};

Другой вариант, который я подумал, - передать значение от компонента создателю действия:

В моем компоненте

class Pagination extends Component {
    ... 
    handlePreviousPage() {
        const {pagination} = this.props;
        this.props.changePreviousPage(pagination);
    }
    ...
} 

В моих действиях создатель

export const changePreviousPage = pagination => {
    let previousPage = pagination.actualPage != 1 ? pagination.actualPage - 1 : pagination.actualPage;

    return{
        type: types.CHANGE_PREVIOUS_PAGE,
        previousPage
    }
};

Как лучше всего это решить?

Автор: Exequiel Demaio Источник Размещён: 19.07.2016 02:37

Ответы (1)


0 плюса

6348 Репутация автора

По моему мнению, всегда используйте / извлекайте состояние в самое ближайшее время к выполнению , здесь - создатель действия (или, точнее, тот ответ, который вы возвращаете, который затем будет выполнен).

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

Еще один момент, на который стоит обратить внимание: вы можете отправлять в создатель действия несколько вещей, которые изменяют состояние и делают недействительным то, что вы передали создателю действия наверху. Кроме того, причина, по которой я считаю let state = getState()во главе создателя действий плохую идею, если вы не уверены, что ничего не изменится во время вашей обработки (как только вы задействуете какие-либо вызовы API, я всегда буду снова использовать getState () вместо использования сохраненная переменная).

Кроме того, помещение данных из состояния в подпорки (с использованием контейнера-редуктора и вспомогательного метода connect) будет вызывать повторное рендеринг при каждом изменении, что может в некоторых случаях влиять на производительность.

Мое личное предпочтение кодирования также состоит в том, чтобы максимально упростить процесс в mapDispatchToProps (при условии, что именно здесь вы передаете свои обработчики, такие как handlePreviousPage) и избегать какой-либо обработки данных (в вашем примере это не так много, но вы легко можете увидеть, как это происходит). может выйти из-под контроля, если вы готовите данные для создателя действий).

Автор: Alex Duggleby Размещён: 19.07.2016 05:10
Вопросы из категории :
32x32