v-model

双向数据绑定

指令v-model双向数据绑定指令。双向数据绑定的概念如下。

(1)数据层（M层）发生变化会影响视图层（V层）改变。

(2)视图层（V层）发生变化会影响数据层（M层）改变。

 

v-model 修饰符

 

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

<template>   <span>     <p>msg: {{msg}}</p>     <input type="text" :value="msg">     <input type="text" v-model="msg">     <p>num: {{num}}</p>     <input type="text" v-model.number="num">     <input type="text" v-model.trim="num">     <input type="text" v-model.lazy="num">     </span> </template>   <script>   export default {     data() {       return {         msg: 'Hello World',         num: 0       }     },     methods: {}   } </script>