element-common-select

props | 参数 | 类型 |默认值 |可选值 | 说明 | |------------ | :-----: | :-----: |:-----: |:-----------------------: | | title | string |-- 请选择 -- |—— |没有值的提示标语 | | items | Array |[] |—— |传入的下拉数组 | | label | string |无 |—— |传入指定的下拉中文字段名 | | value | string |无 |—— |当前选中绑定的值 | | size |string |无 |small,mini|输入框大小，初始默认，另有两个值可选| | width | number |180 |任意整数 |选择框的宽度 | | borderColor | string |#dcdfe6 |—— |选择框的边框颜色 | | optBg | string |white |—— |下拉框的背景颜色 | | optTxtColor | string |#606266 |—— |下拉值的文字颜色 | | activeTxtColor | string |#409eff |—— |当前选中文字颜色 | | disabled | boolean |false |true,false|是否禁止操作 | | clearable | boolean |false |true,false|是否可清除 | | clearIconColor | string |#606266 |—— |清除icon的颜色值 | | clearIconSize | number |16 |任意整数 |清除icon的大小（默认16） |

emit | 方法名 | 说明 | | ------ |:-----------------------: | |change |下拉选项选中和清空的回调，value为选中的对象, 清空则为null|

Example

<template>
  <div id="app">
    <CommonSelectBox
    :value="value"
    :items="optionList"
    label="name"
    :disabled="true"
    @change="change"
    >
    </CommonSelectBox>
  </div>
</template>

<script>
import CommonSelectBox from 'common-select-box'
export default {
  name: 'App',
  data () {
    return {
      value: '', // 当前选中值
      optionList: [
        {name: '选项1', id: 1},
        {name: '选项2', id: 2},
        {name: '选项3', id: 3}
      ]
    }
  },
  components: {
    CommonSelectBox
  },
  methods: {
    change(val) {
      this.value = val? val.name:''
    }
  }
}
</script>