Reactjs 组件异步获取redux状态？

我对redux州有问题。分页组件具有该方法

const setPage = page => {
    props.removeFilterParam('page');
    props.addFilterParam('page', page);
    props.getProducts();
}

props.removeFilterParam

和

props.addFilterParam

是修改redux存储的redux操作，

getProducts

是父组件上的方法，如下所示

async getProducts() {
    try {
        console.log('Filter before', this.props.filter);
        setTimeout(() => console.log('After', this.props.filter), 2000)
        // const slug = this.props.match.params.slug;
        // const queryString = transformToQueryString(this.props.filter);
        // await this.props.getProductsRequest(`/api/categories/${slug}/${queryString}`);
    } catch (error) {
        console.error(error);
    }
}

父组件与redux存储连接。当在控制台中调用

getProducts

时，我看到：

因此，在通过

addFilterParam

修改redux状态后，这些更改不会同步应用于

getProducts

函数

行动包括：

export const addFilterParam = (name, value) => ({
    type: ADD_FILTER_PARAM,
    name,
    value
})

export const removeFilterParam = (name, value) => ({
    type: REMOVE_FILTER_PARAM,
    name,
    value
});

减速器为：

const filterReducer = (state = {}, action) => {
    switch(action.type) {
        case ADD_FILTER_PARAM:
            if (state.hasOwnProperty(action.name)) {
                if (Array.isArray(action.value)) {
                    state[action.name] = [...state[action.name], ...action.value];
                } else {
                    if (state[action.name].indexOf(action.value) === -1) {
                        state[action.name].push(action.value);
                    }
                }
            } else {
                if (Array.isArray(action.value)) {
                    state[action.name] = action.value;
                } else {
                    state[action.name] = [action.value];
                }
            }
            return {...state};

        case REMOVE_FILTER_PARAM:
            if (state.hasOwnProperty(action.name)) {
                if (action.value) {
                    let args = state[action.name];
                    const index = args.indexOf(action.value);

                    if (index !== -1) {
                        args.splice(index, 1);

                        if (args.length) {
                            state[action.name] = args;
                        } else {
                            delete state[action.name];
                        }
                    }
                } else {
                    delete state[action.name];
                }
            }

            return {...state};

        case CLEAR_FILTER:
            return {};

        default: return state; 
    }
}

---

Redux操作不是同步的。他们不会在飞行中改变你的组件道具。它们所做的是触发一个可以改变减速器的动作（就像react

setState

，）。它们肯定会在下一次调用

render（）

时更改。如果需要在道具更改时收到通知，可以使用回调。在您的示例中：

componentDidUpdate(prevProps) {
  const { filter } = this.props
  if (filter !== prevProps.filter) {
    // filter changed
    console.log('Filter changed', filter)
  }
}