自定义 下拉组件，绑定v-model,设置disable属性 以及onchange方法

一个组件上的 v-model默认利用名为 value 的prop

自定义组件中

props:{

    disabled: Boolean,

    value: Array

  },

  model: {//model选项可以自定义prop名称和event名称

    value: 'value',

    event: 'on-change'

  },

mounted() {

    this.$emit('on-change', this.curColorArr); //给一个默认值

  },

methods: {

    //获取选中的颜色数组 ，传给父组件

    getCurColorArr(item){

      this.curColorArr = item.color;

      this.$emit('on-change', this.curColorArr);

    }

}

 

引用自定义组件的组件中

<ColorPicker :disabled="isGrayState" v-model="colorArr" @on-change="changeColorArr"></ColorPicker>