在 Redux Thunk 中使用 getState 是好的做法吗? [英] Is using getState in a Redux Thunk good practice?

问题描述

我在此处的其他问题中看到了相互矛盾的(或让我感到困惑的)答案，这些问题涉及在操作中使用 getState 是否可以接受，而且我已经看到很多次了称为反模式.对我来说，它似乎工作得很好，但如果我们不使用 getState，这样做的最佳实践是什么?

I have seen conflicting (or just confusing, to me) answers in other questions here regarding whether using getState within an action is acceptable, or not, and I have seen quite a few times it being called an anti-pattern. For me, it seems to work great but what is the best practice for doing this if we are not to use getState?

我在 thunk 中使用 getState 来过滤当前连接到一些模拟数据并被拉入应用程序状态的用户数组.

I am using getState within a thunk to filter through an array of users that is currently connected to some mock data and being pulled into the state of the application.

这是我的操作代码:

export const accountLogInSuccess = user => ({
    type: types.ACCOUNT_LOG_IN_SUCCESS,
    user,
});

export const accountLogOutSuccess = () => ({
    type: types.ACCOUNT_LOG_OUT_SUCCESS,
});

export const accountCheckSuccess = () => ({
    type: types.ACCOUNT_CHECK_SUCCESS,
});

export const accountCheck = () => (
    (dispatch, getState) => {
        dispatch(ajaxCallBegin());
        return apiAccount.accountCheck().then((account) => {
            if (account) {
                const user = findByUID(getState().users, account.uid);
                dispatch(accountLogInSuccess(user));
                toastr.success(`Welcome ${user.nameFirst}!`);
            } else {
                dispatch(accountLogOutSuccess());
            }
            dispatch(accountCheckSuccess());
        }).catch((error) => {
            dispatch(ajaxCallError(error));
            toastr.error(error.message);
            throw (error);
        });
    }
);

还有我的减速机:

export default function reducerAccount(state = initial.account, action) {
    switch (action.type) {
    case types.ACCOUNT_LOG_IN_SUCCESS:
        return Object.assign({}, state, action.user, {
            authenticated: true,
        });
    case types.ACCOUNT_LOG_OUT_SUCCESS:
        return Object.assign({}, {
            authenticated: false,
        });
    case types.ACCOUNT_CHECK_SUCCESS:
        return Object.assign({}, state, {
            initialized: true,
        });
    default:
        return state;
    }
}

我的reducer中使用的account的初始状态就是:

The initial state of account used in my reducer is just:

account: {
    initialized: false,
    authenticated: false,
},

accountCheck 操作将用户(使用 getState 和 findByUID 函数找到)传递到 accountLogInSuccess，其中reducer 通过 Object.assign 将其值添加到帐户的当前状态.

The accountCheck action passes the user (found using getState and the findByUID function) into accountLogInSuccess where the reducer adds its values to the current state of account via Object.assign.

宁愿不必在我的应用程序的根目录下获取用户，然后通过 props 将其向下传递，在 Redux 中完成此操作并使用户数据处于可用状态的最佳实践是什么?同样，到目前为止，在 thunk 中使用 getState 对我来说效果很好，但是有没有更好的解决方案，不被视为反模式?

Preferring to not have to get the user at the root of my application and then passing it down via props, what is the best practice to accomplish this within Redux and having the user data be available in state? Again, using getState within the thunk works great for me thus far, but is there a better solution to this that is not considered an anti-pattern?

推荐答案

我写了一篇名为 惯用的 Redux:Thunks、Sagas、抽象和可重用性的思考，详细讨论了这个主题.在其中，我回应了一些对 thunk 和 getState 使用的批评(包括 Dan Abramov 在 在动作创建者中访问 Redux 状态?).事实上，我的帖子特别受到像你这样的问题的启发.

I wrote an extended blog post called Idiomatic Redux: Thoughts on Thunks, Sagas, Abstraction, and Reusability, which addresses this topic in detail. In it, I respond to several critiques of thunks and use of getState (including Dan Abramov's comments in Accessing Redux state in an action creator?). In fact, my post was specifically inspired by questions like yours.

作为我帖子的 TL;DR:我相信 thunk 是在 Redux 应用程序中使用的完全可行的工具，并鼓励使用它们.虽然在使用 thunk 和 sagas 以及在它们内部使用 getState/select 时需要注意一些有效的问题，但这些问题不应该吓跑您使用 thunk.

As a TL;DR of my post: I believe that thunks are a completely viable tool for use in Redux applications, and encourage their use. While there are some valid concerns to be aware of when using thunks and sagas, and using getState/select inside of them, these concerns should not scare you away from using thunks.

这篇关于在 Redux Thunk 中使用 getState 是好的做法吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！