model完成表单的数据双向绑定(3)

使用修饰符.number可以将输入转换为Number类型,否则虽然你输入的是数字,但它的类型其实是String。
 比如在数字输入框时会比较有用,示例代码如下:

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

.trim:

修饰符.trim可以自动过滤输入的首尾空格,示例代码如下:


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

从Vue.js 2.x开始,v-model还可以用于自定义组件,满足定制化的需求,在下一节会介绍。

以上所述是小编给大家介绍的Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/23eedea4b483f9ef29471998fac4816e.html