common-select-box v1.0.4

element-common-select

props | 参数 | 类型 | 说明 | |------------ | :-----: |:-----------------------: | | title | string |没有值的提示标语 | | items | Array |传入的下拉数组 | | label | string |传入指定的下拉中文字段名 | | value | string |当前选中绑定的值 | | size |small,mini|输入框大小，初始默认，另有两个值可选| | width | string |选择框的宽度 | | borderColor | string |选择框的边框颜色 | | optBg | string |下拉框的背景颜色 | | optTxtColor | string |下拉值的文字颜色 | | activeTxtColor | string |当前选中文字颜色 | | clearIconColor | string |清除icon的颜色值 | | clearIconSize | string |清除icon的大小（默认16） |

emit | 方法名 | 说明 | | ------ |:-----------------------: | |getMenu |下拉选项选中的回调，value为选中的对象| |clearClick |清空的回调事件,返回空 |

Example

<template>
  <div id="app">
    <CommonSelectBox
    :value="value"
    :items="optionList"
    label="name"
    @getMenu="getMenu"
    @clearClick="clearClick"
    >
    </CommonSelectBox>
  </div>
</template>

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

  }
}
</script>