组件如何在Vue 2.0中删除自身

仍然可以从组件本身v-if的第一个<div>标签上使用，而不是从其父组件中删除组件。这将在页面中留下一个空组件，这不是最佳实践，但可以避免处理来自父级的事件。

您可以在组件上使用beforeDestroy方法，并使它从DOM中删除。

beforeDestroy () {
  this.$root.$el.parentNode.removeChild(this.$root.$el)
},

不，您将无法直接删除组件。父组件将不得不用于v-if从DOM中删除子组件。

参考：https : //vuejs.org/v2/api/#v-if

引用自文档：

根据表达式值的真实性有条件地渲染元素。元素及其包含的指令/组件在切换过程中被销毁并重建。

如果子组件是作为父对象上某些数据对象的一部分创建的，则您将必须通过$emit，修改（或删除）数据向父对象发送事件，子组件将自行消失。最近对此还有另一个问题：删除Vue子组件

我找不到有关完全删除Vue实例的说明，所以这是我的总结：

module.exports = {
  ...
  methods: {
    close () {
      // destroy the vue listeners, etc
      this.$destroy();

      // remove the element from the DOM
      this.$el.parentNode.removeChild(this.$el);
    }
  }
};