1、lazy
v-model 在每次 input 事件觸發(fā)后將輸入框的值與數(shù)據(jù)進(jìn)行同步,也就是在失去焦點(diǎn)或者按下回車鍵時(shí)才更新

<template><div><p>.lazy修飾符</p><input type="text" v-model.lazy="val"><p>{{ val }}</p></div> </template> <script>export default {data(){return{val:''}}} </script>

2、number
.number 修飾符可以將 輸入的值轉(zhuǎn)化為Number類型 ，否則雖然你輸入的是數(shù)字,但它的類型其實(shí)是String，在數(shù)字輸入框中比較有用

<template><div><p>.number修飾符</p><input type="number" v-model.number="val"><p>我的數(shù)據(jù)類型是：{{ typeof(val) }}</p></div> </template><script>export default {data(){return{val:''}}} </script>

3、trim
.trim 修飾符會(huì)自動(dòng)過(guò)濾掉輸入的首尾空格

<template><div><p>.trim修飾符</p><input type="text" v-model.trim="val"><p>val的長(zhǎng)度是：{{ val.length }}</p></div> </template><script>export default {data(){return{val:''}}} </script> <div id="app"><input type="text" v-model.trim="name" name="" id="" value="" /><span>{{ name }}</span></div>var app = new Vue({el: '#app',data: {name:''}})

總結(jié)

以上是生活随笔為你收集整理的修饰符.lazy .number .trim的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。