Слышал что в Vue.js есть какие то модификаторы, но сталкиваться еще не приходилось, был бы благодарен если бы кто то показал их в деле, и объяснил когда и для чего они нужны)
Это что то типа постфиксов которые добавляются через точку в конце директивы, эти модификаторы как то связывают директиву, вот пример:
var test_1 = new Vue({
el: '#test',
data: {
inputed:''
}
});
Выше у нас код подключения vue объекта к определенному блоку на странице с id test, в data есть одно свойство inputed, которое далее будет изменятся через инпут, к которому приделаем модификатор.
<div id="test">
<input type="text" v-model.lazy="inputed"/>
Вы ввели: {{inputed}}
В этом примере с помощью модификатора lazy мы говорим что бы изменения из инпута переходили только после события change, то есть после того как форма ввода теряет фокус происходит передача нового значения в свойство data.
Если же в html коде убрать возле v-model.lazy тогда процесс немного поменяется:
<div id="test">
<input type="text" v-model="inputed"/>
Вы ввели: {{inputed}}
Как видим, теперь при вводе текста в инпут поле текст моментально переносится в блок где отображается значение inputed.
Этих модификаторов есть очень много, их в основном применяют когда используют директивы v-on и v-model.