0

如何将函数保存为 redux 商店中的状态？

例子：

我将一个函数作为参数传递给 redux-thunk 调度程序函数，我想将此过滤器函数保存在我的 redux 存储中：

export const SET_FILTERED_USERS = 'SET_FILTERED_USERS';

export function setFilteredUsers(filter) {
    return (dispatch, getState) => {
        const allUsers = getState().users.allUsers;
        const filteredUsers = allUsers.filter(filter);

        dispatch({
            type: SET_FILTERED_USERS,
            data: {
                filteredUsers,
                filter
            }
        });

        const activeUser = getState().users.activeUser;

        if (activeUser && !_.isEmpty(filteredUsers) && filteredUsers.indexOf(activeUser._id) === -1) {
            dispatch(setActiveUser(filteredUsers[0]));
        } else {
            dispatch(setActiveUser(allUsers[0]));
        }
    }
}

在 ReduxDevTools 我可以看到，“过滤器”没有被调度并保存在存储中。有没有办法做到这一点？

谢谢

更新：我缩短的减速器：

import {
    SET_FILTERED_USERS
} from '../actions/users';

import assign from 'object-assign';

export const initialState = {
    filter: null,
    filteredUsers: null
};

export default function (state = initialState, action = {}) {
    const {data, type} = action;

    switch (type) {
        case SET_FILTERED_USERS:
            return assign({}, state, {
                filteredUsers: data.filteredUsers,
                filter: data.filter
            });

        default:
            return state;
    }
}
4

1 回答 1

0

正如塞巴斯蒂安丹尼尔所说，不要那样做。根据 Redux 常见问题解答，这会破坏时间旅行调试之类的东西，这不是 Redux 的预期用途：我可以将函数、承诺或其他不可序列化的项目放入我的 store 状态吗？

您可以考虑的替代方法是存储您想要的过滤的某种描述。作为一个相关示例，在我当前的原型中，我正在创建一个我可能想要显示的对话框类的查找表，当我需要显示一个时，我调度一个包含对话框类型名称的操作。我的对话框管理器类将“dialogType”字段拉出状态，使用它来查找正确的对话框组件类，并呈现它。

实际上，另一个问题是为什么您实际上首先要在您的状态中存储一个函数。我看到你在那里试图做的事情，但实际上并不是你希望用它完成的事情。

于 2016-05-18T22:30:53.760 回答