1.0.2 • Published 4 years ago
element-common-select v1.0.2
element-common-select
说明:element下拉框二次封装
方法名 | 参数 | 类型 | 说明 |
---|---|---|---|
无 | lables | string | 传入当前绑定的字段名称 |
无 | defaultVal | string | 传入默认值(如果有) |
无 | options | Array | 传入下拉列表数组 |
无 | optLabel | string | 传入下拉指定的中文字段 |
无 | optVal | string | 传入下拉指定的value字段 |
无 | disabled | Boolean | 是否禁用 |
无 | isMultiple | Boolean | 是否多选 |
selectChange | val, label | Boolean | 回调抛出当前值,当前绑定的字段名称 |
Example
<template>
<div id="app">
<ElementCommonSelect lables="val1" :options="opt1" optLabel="names" optVal="ids" @selectChange="selectChange"></ElementCommonSelect>
<ElementCommonSelect lables="val2" :options="opt2" optLabel="label" optVal="keys" @selectChange="selectChange"></ElementCommonSelect>
<ElementCommonSelect lables="val3" :options="opt3" optLabel="title" optVal="value" @selectChange="selectChange"></ElementCommonSelect>
</div>
</template>
<script>
import ElementCommonSelect from 'element-common-select'
export default {
name: 'App',
components: {
ElementCommonSelect
},
data () {
return {
form: {
val1: '',
val2: '',
val3: ''
},
opt1: [
{names: '选项1', ids: 1},
{names: '选项2', ids: 2},
{names: '选项3', ids: 3}
],
opt2: [
{label: 'lable1', keys: 1},
{label: 'label2', keys: 2},
{label: 'label3', keys: 3},
],
opt3: [
{title: 'title1', value: 1},
{title: 'title2', value: 2},
{title: 'title3', value: 3}
]
}
},
methods: {
selectChange (val, label) {
this.form[label] = val
}
}
}
</script>
<style>
</style>