Vue - 激活 VNode 调整

Question

我有一个 Vue 指令，它向 VNode 添加一个条件类。以下是简短的摘录：

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

对于测试建议，我用true替换了var，只是为了看看这部分实现是否有效。
如果我现在检查 VNodes 数据，我可以看到这个条件类，看起来如果我已将其直接添加到模板中的元素中。但相比之下，类不会添加到 DOM 元素中，因此类属性不可见。
那么，如何使VNode上的此更改处于活动状态呢？
谢谢！

Answer 1

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

您可以直接使用此参数来操作 DOM 元素，以添加新的 CSS 类

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