Vue自定义组件v-model的使用

组件base-select  ，一个自定义的select-options选择组件。
<template>
<div>
  <span v-for="item in list" :key="item.value"
       :class="{'selected':isSelected(item)}"
        @click='$emit("change",item)'    //有时候我们需要把整个对象传出去。
        >
    {{item.name}}
  </span>
</div>

</template>
<script>
  export default {
    model: {
      event: 'change'
    },
    props: {
      value: ''
    },
    data(){
      return {
        list:[{value:1,name:'我是1'},{value:2,name:'我是2'}]
      }
    },
    methods: {
        isSelected(item) {
            if(this.value instanceof Object){
              return item.value === this.value.value;
            }else{
              return item.value === this.value;
            }

        }
    }
  }
</script>
<style lang="less" rel="stylesheet/less" scoped>
.selected{
  color:#f00;
}
</style>

<template>
  <div>
    <base-select v-model="value"></base-select>
  </div>
</template>
<script>
  import baseSelect from './base-select';
  export default {
    components:{
      baseCheckbox
    },
    data() {
      return {
        value: 1
      }
    }
  }
</script>
<style lang="less" rel="stylesheet/less" scoped>
</style>

官方文档-自定义组件的 v-model