如何删除Vue生命周期钩子函数之外创建的dom对象
时间: 2024-01-07 15:04:19 浏览: 188
深入理解Vue父子组件生命周期执行顺序及钩子函数
如果你在 Vue 生命周期钩子函数之外创建了 DOM 对象,你需要手动删除它们。可以在组件实例的 `beforeDestroy` 生命周期钩子函数中删除这些 DOM 对象。
例如,如果你在 `created` 钩子函数中创建了一个 DOM 对象,你可以在 `beforeDestroy` 钩子函数中删除它,代码如下:
```javascript
export default {
created() {
this.myElement = document.createElement('div');
document.body.appendChild(this.myElement);
},
beforeDestroy() {
if (this.myElement) {
this.myElement.remove();
}
},
}
```
在上面的代码中,`created` 钩子函数中创建了一个 `div` 元素,并将其添加到 `document.body` 中。在 `beforeDestroy` 钩子函数中,我们检查 `myElement` 是否存在,如果存在则将其从 DOM 中删除。
你可以根据你的具体需求来修改上面的代码。
阅读全文