.lazy: 會在轉變為change事件中同步

<div id="app"><input type="text" v-model.lazy="message"><p>{{ message }}</p> </div> <script>const app = new Vue({el:'#app',data: {message: ''}}) </script> // message并不實時改變,而是失去焦點或按回車時才更新

.number: 將輸入的值轉換為Number類型

<div id="app><input type="number" v-model.number="message"><p>{{ typeof message }}</p> </div> <script>const app = new Vue({el:'#app',data: {message: 123}}) </script>

.trim: 過濾掉輸入的首尾空格

<div id="app"><input type="text" v-model.trim="message"><p>{{ message }}</p> </div> <script>const app = new Vue({el:'#app',data:{message:''}}) </script>

參考《Vue.js實戰》P63~P64

總結

以上是生活随笔為你收集整理的vue --- 修饰符.lazy、.number、.trim的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。