Как не обновлять значение input'а при пользовательском вводе?

Question

[Михаил Белошицкий]

Есть проекты на vue.js, в некоторых из них не все гладко с датабайндингом.

Хорошо, когда он однонаправленный - из полей ввода данные передаются в стейт и далее растекаются по приложению.

Но есть ряд случаев, когда удобнее использовать двухсторонний датабайндинг - то есть данные могут передаваться как из полей ввода, так и приниматься обратно в них (например, работает валидатор, инициализация полей начальными значениями или нечто подобное). В подобных ситуациях важно не обновлять данные в поле ввода, когда им занимается пользователь, в противном случае его ярость гарантирована.

Может кто знает, есть ли в ангуляре или vue какая-нибудь стандартная возможность для блокировки обновлений поля при пользовательском вводе в них? Свое-то я конечно напишу, но лениво.

Answer 1

[Михаил Белошицкий]

В видео OpenLecture #2017.1 - Let's Vue! нашелся ответ - для этого используются модификаторы. Для моего вопроса подходит модификатор .lazy.

<!-- synced after "change" instead of "input" -->
<input v-model.lazy="msg" >

Документация.

Answer 2

[Николай]

В ангуляре можно в ng-model-options поставить например обновление только при блюре. Ну и использовать parsers/formatters для валидаторов и прочего.

Answer 3

[dmz9]

т.е. пока инпут в фокусе - не применять валидатор, а как только фокус потерян - применять?

Comments

[Михаил Белошицкий]

не "не применять валидатор", а не принимать обновления поля извне

[dmz9]

есть $watch в ангуляре, следит за изменениями.
ставь флаг какой нибудь во время редактирования и запрети обновлять поле из других мест - ведь все точки в которых переменная может быть изменена должны быть на виду (по идее) и в них доступен на чтение флаг. флаг стоит - значит в переменную не пишем. как только фокус пропал с инпута - флаг разрешил изменения "извне"