与 'react-sortable-hoc' 一起工作的奇怪交互 'react-virtualize'

Question

https://codesandbox.io/s/qYEvQEl0

所以我自己写了一个演示，与一个有效的示例相比，它不起作用，唯一的区别是 <List/>

的一个道具

rowHeight={({ index }) => 50}

rowHeight={50}

我用的是后一种方式。它不起作用。为什么？

Answer 1

从 duplicate GitHub issue you filed 复制的答案;)

这会在您每次渲染时创建一个新的函数道具：

rowHeight={({ index }) => 50}

prop-change 足以触发子组件的重新渲染，即使其他属性没有改变。在上面的第二个例子中，道具根本没有改变，所以 List 不知道它需要重新渲染。 （查看文档中的 the section on "pure components" 了解更多信息。）

在这种情况下，您可以传递一个小属性，该属性会在每次排序顺序更改时更改（例如递增的计数器），让组件知道要重新呈现。您也可以调用 forceUpdate.