1.v-modal是什么

v-model就是vue的双向绑定的指令，view层输入值影响data的属性值，data属性值发生改变会更新view层的数值变化。

2.view层影响data属性值

含有v-model这个属性的input元素，则会为这个input元素添加一个input事件，当监听从页面输入值的时候，来更新vue实例中的data想对应的属性值。

element.addEventListener("input",function(e){
    vm.key=e.target.value;
}) 

 3.data属性值影响view层

初始化vue实例时候，会递归遍历data的每一个属性，并且通过defineProperty来监听每一个属性，当某个属性重新赋值，则更新相对于的input元素。

 Object.defineProperty(data,key,{
        get(){
            return data[key];
        },
        set(newVal){
            data[key]=newVal;
            // element是对应元素节点
            element.value=newVal;
        }    
    })

4 .v-modal绑定一个对象中没有的属性是可行的

<template>
    <input v-model="obj.a">
</template>

<script>
export default {
  data(){
    return{
      obj:{}
    }
  }
}
</script>

在修改表单后，view层影响data属性值，监听到了表单变化运行了vm.obj.a=e.target.value，于是给obj添加了一个新属性，所以是可行的。