Reactjs Redux表示属性类似于装饰图案

假设应用程序容器的状态直接来自服务器：

[
  {first: 'tyrion', last: 'lannister', email: 'tmoney@lannister.com'},
  {first: 'jaime', last: 'lannister', email: 'jaime@lannister.com'}
]

我们把数据交给了展示部分，但设计师要求提供大写的全名和模糊的电子邮件

因此，我们希望呈现如下内容：

<div>
   <p>Tyrion Lanniser - tmoney@***.com</p>
   <p>Jaime Lanniser - jaime@***.com</p>
</div>

---

但这似乎是一种反模式？为什么？这种方法的缺点是什么？我觉得这很清楚，因为底层数据/状态没有改变，子组件只是将表示属性添加到它接收的数据中。

我不确定您所指的反模式是什么。这一行令人困惑：

this.state.persons = this.opts.persons.map((person)=> decorate(person))

因为你不需要这个。如果你在redux商店中存储东西，请说明。 在任何情况下，react redux的mapStateToProps函数中的转换都很有意义

---

这是一个完全合乎逻辑的做法，事实上，有一个库专门记录状态转换，并与redux结合使用：

也许我对你的问题感到困惑。。当您通过ajax检索数据时，您正在将其保存在redux存储中，对吗？然后将您的演示组件连接到您的商店？此外，还有一句话：呈现数据。。在减速器/容器中没有任何意义。在一天结束时，总会有一些表现组件来呈现东西。是的，这个问题假设所有东西都“连接”好了，原始服务器数据都在redux存储中。我只是想了解一些关于表象属性的细节，比如大写、模糊、格式等等。还有什么我可以说的来更具体地回答你的问题吗？对不起，我很忙。我会接受的。这是有道理的。我的问题对你来说可能很奇怪，因为我们使用的是一个模仿react的bastardized Riot.js工具链。。。。不使用MapStateTops。。。。但我们可能应该。哦。。好吧，我刚刚看到你们的编辑，从其他地方获取状态，并将其转换为本地状态，这是一个反模式，因为你们创建了两个真相来源。转换不应成为新状态。。只要转换它并立即返回演示文稿即可

this.state.persons = this.opts.persons.map((person)=> decorate(person))

connect(state => ({ persons: state.persons.map(decorate) }))
(
  props => 
    <div>
      {/* do something with props.persons in presentation */}
    </div>
)