自定义组件实现双向绑定v-model

　　自定义组件实现 v-model 双向绑定，首先要先明白 v-model，这个指令到底实现了什么？

v-model实际做的事情就是：传入一个value属性值，然后监听input事件返回一个值，用该返回值赋值value对应的传入值。

# 正常写法
<input v-model="userName" />

# 换种写法
<input :value="userName " @input="demoValue = $event.target.value" />

# 再换写法：
自定义组件 <ButtonComponent /> 实现双向绑定
ButtonComponent组件的写法：
<button
　　v-for="(item, index) in options"
　　:key="item.$value"
　　@click="handleTabSelect(item)">
　　{{ item.$text }}
</button>

　　props：
　　　　value: {
 　　　　type: String,
　　　　　default: ’’

　　　　},

　　　　options: {
　　　　　　type: Array,
　　　　　　default: []
　　　　}

　　methods：
　　handleTabSelect(item) {
　　　　this.$emit(‘input’, item.$value);
　　}

使用组件 <ButtonComponent /> 直接使用v-mode的方式就能读取数据了

　　<ButtonComponent v-model="tabValue" :options="tabOptions" />

　　或者

　　<ButtonComponent :options="tabOptions" @input="handleValue"/>　　

　　data:

　　tabValue="",

　　tabOptions = [{

　　　　$text: "本地选择",

　　　　$value: "local"

　　} , {

　　　　$text: "COS选择",

　　　　$value: "cos"

　　}]　　

　　methods:

　　handleValue(value){

　　　　this.tabValue = value;

　　}