双向数据绑定v-model的原理

原理见vue响应式。object.definepropty
v-model 相当于动态绑定input的value=msg，并且绑定input事件，把当前input标签的value值赋值给msg

<div id="app">
  <div>{{msg}}</div>
  <!-- 写法1 -->
  <input type="text" v-bind:value="msg" v-on:input="handle">
  <!-- 写法2 -->
  <input type="text" v-bind:value="msg" v-on:input="msg=$event.target.value">
  <!-- 写法3 -->
  <input type="text" v-model="msg">
</div>
<script type="text/javascript">
  var vm = new Vue({
    el: '#app',
    data: {
      msg:'Hello Vue!'
    },
    methods: {
      handle:function(event){
      // 使用输入域中最新的数据来覆盖原来的数据
      this.msg = event.target.value;
      }
     }
});
</script>