【问题标题】:Redux: dispatch function to store?Redux:要存储的调度功能?
【发布时间】:2016-05-18 20:13:27
【问题描述】:

如何将函数保存为 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;
    }
}

【问题讨论】:

  • 你的减速器是什么样子的?在那里,您应该能够控制存储在商店中的内容。
  • 不要在你的状态下保存函数,它们不可序列化,这违背了 redux 的整个原则。
  • @SebastienDaniel:好的,谢谢!
  • 谢谢@SebastienDaniel,也不知道 :-)

标签: redux redux-thunk


【解决方案1】:

正如塞巴斯蒂安丹尼尔所说,不要那样做。根据 Redux 常见问题解答,这会破坏时间旅行调试之类的东西,而不是 Redux 的预期用途:Can I put functions, promises, or other non-serializable items in my store state?

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

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

【讨论】:

  • 如果“函数”是 promise 的 cancelToken 怎么办。你会把它存放在哪里?
  • 视情况而定。您还需要在哪里访问它?
猜你喜欢
  • 2020-10-12
  • 1970-01-01
  • 2019-10-16
  • 2017-09-17
  • 1970-01-01
  • 2018-01-06
  • 2020-08-25
  • 2019-10-12
  • 2014-02-07
相关资源
最近更新 更多