VueJS - Как применять директивы ко всем соответствующим тегам?

Я хотел бы применить директиву ко всем input теги программно. Для этого есть две причины:

  1. Я не хочу проходить через все входы в моем приложении, чтобы добавить директиву
  2. Если я хочу изменить директиву для всех входов позже, она будет в одном месте.

Это возможно? Я просмотрел документы, но они, кажется, не упоминают, что применяли его каким-либо другим способом, кроме применения тега непосредственно к элементу.

Мой текущий код выглядит так:

<input type="text" class="form-control input-sm" id="price" v-model="model.doc.price" v-floating-label>
Источник

3 ответа

Решение

Кажется, у меня был мозг мертвый момент. Мне просто нужно input компонент. Затем я могу изменить то, что мне нужно, и он будет обновляться везде, где использовался компонент ввода, и вместо стандартного html input тег, я буду использовать мой компонент.

Долгий день...

Я сам ответил на этот вопрос вместо того, чтобы удалить его на тот случай, если у кого-нибудь еще будет такой же мертвый момент в будущем;)

Источник

Согласно Эван Ю:

Компиляция Vue.js происходит, когда вы создаете / монтируете корневой экземпляр.

См. https://github.com/vuejs/Discussion/issues/77.

Я не думаю, что то, что вы пытаетесь сделать, является вменяемым: поиск и замена, выходящие из коробки во многих текстовых редакторах или IDE, будут действительно полезны по вашим двум объясненным причинам.

Источник

Вы можете связать эту директиву с таким условием

<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.

Источник
Другие вопросы по тегам