javascript - VueJS - 如何将指令应用于所有匹配的标签？

Question

我想以input编程方式将指令应用于所有标签。造成这种情况的两个原因是：

1. 我不想通过我的应用程序中的所有输入来添加指令
2. 如果我想在以后更改针对所有输入的指令，它就在一个地方。

这可能吗？我已经查看了文档，但他们似乎没有提到以任何其他方式应用它，而不是将标签直接应用于元素。

我当前的代码是这样的：

<input type="text" class="form-control input-sm" id="price" v-model="model.doc.price" v-floating-label>

Answer 1

我似乎有一个脑死的时刻。我只需要一个input 组件。然后我可以在那里更改我需要的内容，它会在所有使用输入组件的地方更新，而不是使用标准的 htmlinput标记，我将使用我的组件。

漫长的一天 ...

我自己回答了这个问题，而不是删除它，以防其他人将来有同样的脑死时刻；）

Answer 2

根据埃文·尤：

Vue.js 编译发生在您实例化/挂载根实例时。

见https://github.com/vuejs/Discussion/issues/77#issuecomment-60339440

我不认为您正在尝试做的事情是理智的：搜索和替换，在许多文本编辑器或 IDE 中开箱即用，对您解释的两个原因非常有帮助。

Answer 3

您可以将该指令绑定到这样的条件

<input type="text" 
       class="form-control input-sm" 
       id="price" 
       v-model="model.doc.price" 
       :v-floating-label=(condition)>

如果condition == true，v-model-float指令将应用于您的输入。

更新 1：从评论来看，实现仍然是相同的，除了你从一个地方控制条件。这样，您可以在以后删除该指令，只需将该条件设置为 false。