Redux

Question

我正在使用 Redux 和 ImmutableJS 来管理我的应用程序的状态。我创建了以下两条记录：

export const OrderRecord = Record({
    id: null,
    productId: null,
    amount: 1,
});

export const ProductRecord = Record({
    id: null,
    name: '',
    price: 0,
});

我的全局状态是基于 normalizr 方法标准化的，如下所示：

const state = {
    entities: {
        orders: new OrderedMap(new Map({
            1: new OrderRecord(createOrderItem(1, 1)),
        })),
        products: new OrderedMap(new Map({
            1: new ProductRecord(createProductItem(1)),
        })),
    },
};

我将此规范用于测试目的。

现在我正在尝试使用重新选择对计算字段进行一些选择。

export const getVisibleOrders = createSelector(
    [getProducts, getOrders],
    (products, orders) => {
        orders.map(order => {
            const product = products.get(order.productId.toString());
            if (!product) {
                return order;
            }
            const totalPrice = order.amount * product.price;
            order.set('productName', product.name);
            order.set('totalPrice', totalPrice);
            return order;
        });
    }
);

，但我收到以下错误消息：

Error: Cannot set unknown key "productName" on Record

我知道原因 - 记录不能包含任何未定义的键，但我的问题是：有没有建议的方法如何优雅地解决这个问题？

我不想扩展我的记录来支持这种计算参数（product.name 和 totalPrice）。
我不想将静态参数和计算参数放在一个地方，因为例如 'productName' 参数来自 "Product" 实体而不是 "Order" 实体。

谢谢。

Answer 1

使用 Immutable.Record 的全部意义在于不允许您向记录添加新键，因此您会收到错误消息。如果你想在外面使用它们，选择器的全部意义在于暴露这样的 "computed" 属性。在你的情况下，如果你需要使用点分语法，你可以简单地 return 一个新的 Map() 对象或一个新的记录类型：

return Map({
  productName: 'foobar'
}).merge(order)

Redux - 跨实体状态管理

Redux - cross-entity state management

state

immutable.js

react-redux

reselect