Reactjs 如何最好地将Immutable.JS列表发送到无状态React组件中？

我正在使用Redux、Immutable.JS和React。我想将一个Immutable.JS列表传递到我的无状态React组件中。该组件映射整个列表，并为列表中的每个项目呈现一个子项

例如：

function Cats(props) {

  function Cat(p) {
    return <li key={p.id}>p.name</li>;
  }

  return <ul>{props.cats.map(Cat)</ul>;
}

功能猫（道具）{
功能Cat（p）{
返回
p.name
；
}
return
{props.cats.map（Cat）
；
}

{p.id}

部分中断，因为

props.cats

是一个不可变的.JS映射列表，所以我必须更新React组件，改为说

{p.get（'id'）}

我可以这样做，但是有没有更好的方法让无状态React组件在不知道它是不可变的.JS列表的情况下使用列表？这种用法违反了Redux+Immutable.JS+React最佳实践中的最佳实践，“在任何地方都使用不可变的.JS，除了你的哑组件”

我确信其他人已经解决了这个问题，我不想重新发明轮子。

你没有错。 如果使用ImmutableJs，您应该做的是

p.get（'id'）

另一种方法类似于

props.cats.map（elem=>）

或者IMHOP不那么优雅

props.cats.map（elem=>elem.toJs（））.map（Cat）

，但这只是做同一件事的不同方式

---

希望它对你有所帮助，

可以与你的痛苦联系起来，我在这里记录了这一点-

对于Redux 您可以使用

mapStateToProps

将不可变项转换为普通JS（

state.toJSON（）

）。因此哑（不喜欢该术语）组件应该从您的状态的实际结构中抽象出来

否则 这是一个需要在州库和视图之间进行抽象的问题。在某种程度上，我能够隔离这一问题的一种方法是使用（镜头）[如果镜头看起来太复杂，可以制作

get（[key path]，source）

方法，并将其以道具形式发送到组件，然后使用它获取值。这至少提供了一些抽象