如何防止React重新渲染整个IFrame？

Question

我正在开发一个简单的 React UI，它使用 React 漂亮的拖放库进行拖放 然而，这些项目使用带有第三方应用程序小部件的 iframe。

当我拖动它们时，它们会重新渲染整个 iframe，这是我不希望发生的情况，有办法阻止这种情况吗？

查看发生这种情况的示例。

https://codesandbox.io/p/sandbox/react-beautiful-dnd-sample-forked-49cc7x?file=%2Fsrc%2FApp.tsx

如何防止重新加载？

Answer 1

您可以使用

useMemo

来实现。

在这里，我将 iframe 和卡片存储到

useMemo

。它工作正常并且不会重新渲染 iframe..

https://codesandbox.io/p/sandbox/react-beautiful-dnd-sample-forked-kr6n27?file=%2Fsrc%2FApp.tsx%3A33%2C46