how to remove element in vue directive

Question

I want to create a v-if like directive, but i can't find a way to remove element so i hide the element like this..

<Button v-check="'aaa'" type="primary">aaa</Button>
<Button v-check="'bbb'" type="primary">bbb</Button>

Vue.directive('check', {
    bind(el, binding, vnode, old) {
        if (binding.value === 'aaa') {
            el.style.display = 'none'
        }
    }
})

i want to remove the element totally Is there any way that i can remove the element?

Answer 1

ok, i find a way

Vue.directive('check', {
  inserted(el, binding, vnode, old) {
    if (binding.value === 'aaa') {
      vnode.elm.parentElement.removeChild(vnode.elm)
    }
  }
})