【发布时间】：2023-01-08 05:47:59
【问题描述】：
描述
我的网页项目有一个 VantaJS 动态背景，我试图添加一个复选框选项来禁用动态背景。
官方 VantaJS 文档的“清理”部分解释了如何破坏 Vanta 效果： https://github.com/tengbao/vanta#cleanup
const effect = VANTA.WAVES('#my-background')
effect.destroy() // e.g. call this in React's componentWillUnmount
问题
这是我的示例代码，我在其中添加了一个 Bootstrap 复选框，在我的理解中，它应该在切换时破坏 Vanta 效果： https://jsfiddle.net/playdohsniffer/un6hx1q5/131/
为什么在切换复选框时 Vanta 效果没有被杀死？
看起来它应该可以使用 vanilla Javascript。是否需要使用 React 来调用所述 destroy() 函数？我根本不熟悉 React 框架......
更多细节
我知道有几种方法可以使用 vanilla JavaScript 从 DOM 中隐藏/删除特定元素。在我的示例代码中，我添加了两个额外的按钮来演示两种这样的方法：
- 样式可见性属性
- HTML DOM remove() 方法
然而，这些不同的方法并不可取，因为它们隐藏/删除了 div 中的全部内容。相反，我需要弄清楚如何销毁在 div 背景中呈现的 VantaJS 元素（无论如何清理消耗的资源是正确的方法..）
任何建议表示赞赏。
【问题讨论】：
标签： javascript module three.js vantajs