V-Model详解

1.v-model就是一个语法糖，可以作用于各类表单元(input,radio,checkbox,select等)和自定义事件,最终生成的都是value属性和input事件，但是不是一定的，比如checkbox就是checked值和change事件

父组件

<Number  :value = 'num'   @input=num=$event ><Number/>
<!--使用v-model写法-->
<Number  v-model = 'num'></Number>

子组件

  <div>{{value}}</div>
  <div   @click="handleClick(value++)">+</div>
  
  props:['value']
  
  function handleClick(value){
      this.$emit('input',value)
  }

2使用在自定义组件时，默认是value属性和input事件，但是是可以更改的

父组件

<Number  v-model = 'num'></Number>

子组件

<div>{{number}}<div/>
<div   @click="handleClick(number++)">+</div>

const comp = {
    model:{
        prop:'number',
        event:'change'
    }
}

function handleClick(value){
    this.$emit('change',value)
}