javascript - React - createPortal 或 appendChild 的仅附加行为？

Question

我有大量元素由一个共同的父级呈现。当用户采取行动时，应该删除一些元素，并附加一些额外的元素。以“React 方式”执行此操作，父级有一个数组，该数组拥有所有子级元素的状态。在用户单击时，父级不变地修改数组，瞧……DOM 中的新元素。问题在于，由于必须比较页面上的每个元素，即使使用元素键和记忆，它通常也会很缓慢。我一直在与 React 的差异算法作斗争，以使这项工作有效地进行。理想情况下，这个父组件将仅负责添加新的子组件……一旦它们被引导，它们将控制自己的状态。

我刚刚阅读了有关Portals的内容，并试图了解是否ReactDOM. createPortal(<Child />, document.getElementById('myFavoriteDiv'))允许这种仅附加行为而不改变任何先前渲染的子项。我认为这样做的非声明性方式是 appendChild，但我认为这是不受欢迎的。如果这不起作用，您会建议什么替代方案？

标签： javascriptreactjsecmascript-6react-hooksecmascript-2016