3.4　v-model指令的修饰符

除了常规用法，这些指令也支持特殊方式绑定方法，以修饰符的方式实现。通常都是在指令后面用小数点“.”连接修饰符名称，用于指出一个指令应该以特殊方式绑定。例如，.prevent修饰符告诉v-on指令对于触发的事件调用event.preventDefault（）。

v-model指令的修饰符如下：

·v-model.lazy：只有在input输入框发生一个blur事件时才触发。

·v-model.number：将用户输入的字符串转换成数字。

·v-model.trim：将用户输入的前后空格去掉。

1.v-model.lazy：取代input监听change事件

在默认情况下，v-model在每次input事件触发后将输入框的值与数据进行同步（除了上述输入法组合文字时）。你可以添加lazy修饰符，从而转变为使用change事件进行同步，示例代码如下：

---

<!-- 在change时而非input时更新 -->
<input v-model.lazy="msg" >

---

2.v-model.number：输入字符串转为数字

如果想自动将用户的输入值转为数值类型，可以给v-model添加number修饰符，示例代码如下：

---

<input v-model.number="age" type="number">
<!--这通常很有用，因为即使在 type="number" 时，HTML 输入元素的值也总会返回字符串-->
<!--主要用于限制用户输入的时候只能是数字-->

---

3.v-model.trim：输入首尾空格过滤

如果要自动过滤用户输入的首尾空白字符（空格），可以给v-model添加trim修饰符，示例代码如下：

---

<!-- trim 修饰符->
<input v-model.trim="msg">

---