Javascript 在何处使用Redux处理计算属性？

当使用Redux时，存储应该是唯一的真相来源，并且没有冗余。假设商店的一部分代表有姓名和年龄的人。传统面向对象编程中的person类可能如下所示：

class Person {
    constructor(first, last, birthday) {
        this.first = first;
        this.last = last;
        this.birthday = birthday;
    get_fullname() { // ... //}
    get_age() { // ... //}
}

但是，在Redux存储区中的对象上不允许使用方法。那么，这些“方法”应该在哪里实施呢？

有两种方法：

在减速器中

不确定你从哪里得到了“商店内无冗余”规则。将计算结果与源数据一起保存在存储中是完全有效的（尽管在连接姓名和姓氏这样的简单情况下，这可能不是最好的方法）

在选择器中

选择器是用于从存储中获取特定分支的函数。他们还可以在返回之前对其进行计算

我认为这是两种方法中比较好的一种，在需要的地方加上一些备忘录

---

您可以使用选择器在

connect

函数中按需计算这种状态

这是一个选择器库，设计用于Redux

从技术上讲，没有规则规定您不能在reducer中处理它，然后将预计算状态存储在存储中，但是您必须记住每次依赖属性更改时都要更新它

通常，如果您将冗余数据保留在存储之外，并且使用选择器允许您在需要时在组件之间编写和共享按需计算，那么最终将得到更简单的代码

function getFullName(state) {
  return `${state.first} ${state.last}`;
}

function mapStateToProps(state) {
  return {
    fullName: getFullName(state)
  };
}

connect(mapStateToProps)(MyComponent);