22. VUE 的 V-model 修饰符

三个：

第一个是 lazy修饰符：【懒】

我们都知道你绑定了之后 他是实时更新的，但是我们一般不需要他这样，如果我们是用户输入账号或密码的时候，我们离开焦点或按回车后才是确定输入完毕，那么那个时候才绑定不是最好的嘛，所以：

<div id="app">
    <input type="text" placeholder="请输入账号" v-model.lazy="choice">
    您输入的是：{{choice}}    <!--当你按下回车或者失去焦点时才会更新！-->
    <br><br><br>
    <button>注册</button>
</div>

<script>
    const app = new Vue({
        el:"#app",
        data:{
            choice:"",      //变量
        }
    })
</script>

所以 很方便。。。。蛮方便了 头秃了而已

---

 

 number修饰符：

默认情况下，在输入框中无论我们输入的是字母还是数字，都会被 当做字符串类型进行处理。所以如果你想存到变量中是 number 类型，就用这玩意即可：

<div id="app">
    <input type="text" placeholder="请输入账号" v-model.number="value">
    <br>
    值：{{value}} -- 类型: &nbsp&nbsp;{{typeof value}}    <!--注意看值 这个修饰和 内个 parseInt 函数差不多 自己尝试吧-->
    <br><br>
    <button>注册</button>
</div>

<script>
    const app = new Vue({
        el:"#app",
        data:{
            value:"",      //变量
        }
    })
</script>

---

 

trim修饰符：

就是删首尾空 ，没什么好说的 自己加入即可：

................