vue修饰符

41 阅读1分钟

v-model的修饰符

**1、lazy修饰符**  
*用户使用v-model之后,用户每次修改输入内容,都会将后台的数据同时绑定,为了避免这种情况的发生,使用lazy修饰符来进行限定。只有当用户的input中失去焦点或者用户点击回车按钮时,才会将后台的数据进行修改。*
<!--  lazy修饰符:使得用户在输入数据之后,当数据失去焦点或点击回车时,才会进行数据的更新-->
  <input type="text" v-model.lazy="message">
  <h2>用户输入的内容: {{message}}</h2>
**number修饰符**
当用户在input中输入数字时,浏览器会默认将输入的数字转化为string类型,使用number修饰符来将输入的数字转为[number类型]
**3.trim修饰符**
<!--  trim修饰符:将用户输入的文本信息中开头的空格,结尾的空格都删除-->
  <input type="text" v-model.trim="name">
  <h2>用户输入的内容: {{name}}</h2>

事件修饰符

1`.stop` ​ 阻止单击事件继续传播。
(2`.prevent` ​ 阻止标签的默认行为。