Некоторые особенности работы директивы v-model с элементами управления в Vue.js:

• Двусторонняя привязка данных. 1 Если что-то новое оказывается в поле ввода, это приводит к изменению данных. 1 И наоборот: когда меняются данные, обновляется состояние элемента управления, эти данные использующего. 1
• Игнорирование начальных значений атрибутов value, checked или selected на любых элементах форм. 4 Данные текущего активного экземпляра всегда считаются источником истины. 4 Начальное значение необходимо объявить на стороне JavaScript, внутри опции data компонента. 4
• Использование разных свойств и событий для различных элементов ввода: 4
• элементы для ввода текста и многострочного текста используют свойство value и событие input; 4
• чекбоксы и радиокнопки используют свойство checked и событие change; 4
• выпадающие списки используют свойство value и событие change. 4
• По умолчанию v-model синхронизирует ввод с данными по событию input. 4 Можно указать модификатор lazy, чтобы использовать для синхронизации после события change. 4
• Для элемента textarea при использовании директивы v-model внутри него нельзя поместить текст с помощью интерполяции. 3 При вводе текста в textarea с помощью клавиши Enter можно переносить строки. 3 Чтобы переносы строк сохранялись при выводе текста на страницу, необходимо применять соответствующие стили CSS. 3