redux容器呈现要传递哪些参数的集合?

我们正在使用react+redux,效果很好。但有一种情况我永远不知道该用哪种策略。

当我需要在一个集合上循环时,我可以写:

1. 传递元素

代码:

render() {
  collection.map(element => <ElementItem key={element.id} element={element} />)
}

2. 通过扩展元素

代码:

render() {
  collection.map(element => <ElementItem key={element.id} {...element} />)
}

3. 通过ID

代码:

render() {
  collection.map(element => <ElementItem key={element.id} id={element.id} />)
}

在 ElementItem.js 以下内容:

connect((state, ownProps) => {
  element: state.collection.find(_el => _el.id === ownProps.id)
})(ElementItem)

4. 一体化文件:

代码:

render() {
  collection.map(element => <li key={element.id}><p>{element.name}</p></li>)
}

• 解决方案4是不可重用的,所以不太有趣。
• 我不喜欢解决方案2,因为属性淹没在其他属性中
• 我发现3是最干净的,因为它是一个与较少的依赖和转发道具。最大的折衷是,推出 .find 为每个人 ElementItem

所以我想这是第一个赢的。但我觉得这不是 红土路 做一些事情,是吗?如果我通过了 element 参数,为什么我不能通过更多?那么我们就失去了隔离的好处 container 从 presentation 组件,不是吗?