Vue - 激活VNode调整

Question

我有一个 Vue 指令，它将一个条件类添加到VNode。这是一个简短的摘录：

Vue.directive('editable', {
  bind (el, binding, vnode) {
    vnode.data.class = {'hidden': var}
  }
})

对于测试建议，我将var替换为true，只是为了查看这部分实现是否有效。
如果我现在检查VNodes数据，我可以看到这个条件类，如果我将它直接添加到模板中的元素，它看起来就像。但相比之下，该类未添加到DOM元素中，因此类属性不可见 那么如何才能在VNode上进行这种更改呢？ 谢谢！

Answer 1

你得到的第一个参数是el这是指令所在的元素。

您可以直接使用此参数来操作添加新CSS类

的案例中的DOM元素

Vue.directive('editable', { 
    bind (el, binding, vnode) { 
         if(condition){
             el.className += " " + "hidden";
         }
   }
})