Redux从操作中访问状态

时间:2018-03-27 20:52:23

标签: javascript reactjs redux state

我已经在线阅读多个来源,建议尽可能避免在您的操作中访问状态,但是我想知道在进行另一个异步请求之前检查我的状态中是否已存在数据时是否可以接受这样做?目前我的行动中有这个:

export const setCategory = (id) => {
    const state = store.getState();
    const categories = state.display.categories;
    const category = categories.find(category => category.id === id);
    const categoryVids = category ? category.videos : {};
    if(Object.keys(categoryVids).length <= 0) { 
        return dispatch => {
            //Do some async stuff
        }
    }
}

对我来说,在这里访问状态似乎更合乎逻辑。将此逻辑移动到组件是否会被视为更好的做法?

2 个答案:

答案 0 :(得分:1)

你的代码在正确的轨道上,但你应该将整个事情写成thunk,因为它可以直接访问getState

export const setCategory = (id) => {
    return (dispatch, getState) => {
        const state = getState();
        const {categories} = state.display;
        const category = categories.find(category => category.id === id) || {};
        const {videos : categoryVids = {} } = category;

        if(Object.keys(categoryVids).length >= 0) {
            // dispatch here
        }
    }
}

答案 1 :(得分:-1)

您的动作创建者通常应该是不会产生副作用的纯函数。您不希望在您的操作创建者中访问状态的原因是因为这意味着无法根据其参数预测SELECT accounts.id as id , accounts.created_at , accounts_history.history_id as accounts_history_id , accounts_history.accounts_id , accounts_history.history_change_date , accounts_history.field , accounts_history.status_name FROM accounts LEFT JOIN accounts_history ON accounts_history.accounts_id = accounts.id WHERE accounts.created_at::date = date '2018-03-14' AND (accounts_history.field = 'Status' OR accounts_history.field = 'created') LIMIT 10; 的结果。 Redux的重点是能够以直接的方式推断应用程序的状态。如果你不能轻易地跟踪由于发送给定动作而导致的状态变化,那就变得更加困难。

当您需要根据状态的某些部分是否存在来有条件地分派操作时,在“客户端”代码(即Redux的角度来看客户端)中更明确地执行此操作,在这种情况下可能是零件。如果数据丢失,您可以进行检查,然后发送某种setCategory()操作。

但是,如果您需要执行异步操作,则应调查Redux中async operations的常见模式,或使用现有库,例如Redux Thunkredux-saga