vue.extend后的组件 ，当页面销毁的时候。组件怎么销毁

• Z时代
• 2024-03-13
• 分类：IT

main是一个提示的组件，挂载到 vue上，再页面里引用。现在的问题是页面销毁后，组件却没销毁。请问各位大佬这样的咋处理下

<template>
  <el-dialog
    title="提示"
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
  >
    <div class="dialog-box">
      <el-scrollbar wrap-class="scrollbar-wrapper">
        <div class="tip-text" v-html="messageText" />
      </el-scrollbar>
    </div>
  </el-dialog>
</template>
methods: {
    openDialog() {
      this.dialogVisible = true
    }
  }

import Vue from 'vue'
import Main from './main.vue'
const ShowMessageConstructor = Vue.extend(Main)
const ShowMessage = function(option) {
  const instance = new ShowMessageConstructor()
  instance.message = option
  instance.openDialog()
  instance.$mount()
  document.body.appendChild(instance.$el)
}
Vue.prototype.$showMessage = ShowMessage
export default ShowMessage

回答：

参考elementUI的message-box组件，增加一个hashchange组合close的处理应该可以

https://github.com/ElemeFE/el...

回答：

this.$destroy(true);
this.$el.parentNode.removeChild(this.$el);

以上是 vue.extend后的组件 ，当页面销毁的时候。组件怎么销毁 的全部内容， 来源链接： utcz.com/p/936030.html