Vue——v-model的三种修饰符lazy、number、trim
v-model.lazy：值修改操作完成之后才会发生变化。
v-model.number：值修改时，保持其值为Number类型。
v-model.trim：剔除输入框内内容的空格，使其输入符合规则。
<body>
<div id="app">
<!-- 1.修饰符：lazy -->
<input type="text" v-model='message'>只要改变就会同步
<br>
<input type="text" v-model.lazy='message'>敲了回车（或失去焦点）才改变
<h2>{
{
message}}</h2>
<hr>
<!-- 2.修饰符：number -->
<input type="number" v-model='age'>只要修改了，就变成了string类型
<br>
<input type="number" v-model.number='age'> 依旧是number类型
<h2>{
{
age}}--{
{
typeof age}}</h2>
<hr>
<!-- 3.修饰符：trim -->
<input type="text" v-model.trim='name'>在控制台打印 app.name 若有空格，则会显示
<h2>您输入的名字：{
{
name}}</h2>
</div>
<script src="../JS/vue.js"></script>
<script>
const app = new Vue({
el:'#app',
data:{
message:'你好！',
age : 0,
name:'先打空格在写内容'
}
})
</script>
</body>
执行结果如下：
