react.js - react 使用masonic做瀑布流，同一个布局下有两个瀑布流，滑动一个，另一个瀑布流也会重新计算位置，怎么处理？

Question

react 使用masonic做瀑布流，同一个布局下有两个瀑布流，滑动一个，另一个瀑布流也会重新计算位置。这个有人知道怎么处理吗？求大佬指教

随着底部红色区域滑动，顶部也跟着自动重新计算，导致出现了黄色区域的空白

demo地址:https://codesandbox.io/s/masonic-example-forked-gwrvw7?file=/...

Answer 1

这个问题似乎涉及到 React 和 Masonic 瀑布流的交互。从你提供的图片和描述来看，当你滑动一个瀑布流时，另一个瀑布流也会重新计算位置，导致顶部出现空白。

要解决这个问题，你可以考虑以下几种方法：

1. 使用独立的 Masonic 实例：为每个瀑布流创建独立的 Masonic 实例，这样它们就不会相互影响。确保在渲染时正确地配置每个实例的参数。
2. 控制 Masonic 的自动重新计算：检查 Masonic 的文档，看看是否有方法可以控制其自动重新计算的行为。也许你可以通过设置某些属性或选项来禁用这种行为。
3. 使用自定义事件处理器：如果你不想禁用自动重新计算，但希望控制它何时发生，可以尝试使用自定义事件处理器。在事件处理程序中，你可以根据需要手动触发重新计算，而不是依赖于 Masonic 的默认行为。
4. 调整瀑布流的配置：检查瀑布流的配置，看看是否有可以调整的参数来改善这个问题。例如，调整瀑布流之间的间距或大小，以避免在滑动时出现空白。

在处理这个问题时，确保仔细阅读 Masonic 的文档和了解其工作原理。这样可以帮助你更好地理解和解决可能出现的问题。

以上是一些可能的解决方案，你可以尝试其中的一个或多个来解决问题。如果你需要更具体的帮助或代码示例，请提供更多的上下文和代码细节。