add on-clear event
This commit is contained in:
parent
d4f39edc35
commit
7dbde804d8
3 changed files with 19 additions and 9 deletions
|
@ -671,16 +671,16 @@
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Select v-model="model1" size="small" style="width:200px;">
|
<Select v-model="model1" size="small" style="width:200px;" >
|
||||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
<Select v-model="model10" size="small" multiple style="width:260px">
|
<Select v-model="model10" size="small" multiple style="width:260px" >
|
||||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
|
|
||||||
<br><br>
|
<br><br>
|
||||||
|
|
||||||
<Select v-model="model1" size="large" style="width:200px">
|
<Select v-model="model1" size="large" style="width:200px" clearable @on-clear="onClear">
|
||||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
<Select v-model="model10" size="large" multiple style="width:260px">
|
<Select v-model="model10" size="large" multiple style="width:260px">
|
||||||
|
@ -761,6 +761,11 @@
|
||||||
model10: [],
|
model10: [],
|
||||||
model11: []
|
model11: []
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onClear(){
|
||||||
|
console.log('onClear');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -25,7 +25,7 @@
|
||||||
@blur="onInputFocus"
|
@blur="onInputFocus"
|
||||||
|
|
||||||
ref="input">
|
ref="input">
|
||||||
<Icon type="ios-close" :class="[prefixCls + '-arrow']" v-if="resetSelect" @click.native.stop="resetSelect"></Icon>
|
<Icon type="ios-close" :class="[prefixCls + '-arrow']" v-if="resetSelect" @click.native.stop="onClear"></Icon>
|
||||||
<Icon type="arrow-down-b" :class="[prefixCls + '-arrow']" v-if="!resetSelect && !remote && !disabled"></Icon>
|
<Icon type="arrow-down-b" :class="[prefixCls + '-arrow']" v-if="!resetSelect && !remote && !disabled"></Icon>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -165,6 +165,9 @@
|
||||||
if (this.filterable && e.target === this.$el){
|
if (this.filterable && e.target === this.$el){
|
||||||
this.$refs.input.focus();
|
this.$refs.input.focus();
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
onClear(){
|
||||||
|
this.$emit('on-clear');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|
|
@ -42,6 +42,7 @@
|
||||||
@on-query-change="onQueryChange"
|
@on-query-change="onQueryChange"
|
||||||
@on-input-focus="isFocused = true"
|
@on-input-focus="isFocused = true"
|
||||||
@on-input-blur="isFocused = false"
|
@on-input-blur="isFocused = false"
|
||||||
|
@on-clear="clearSingleSelect"
|
||||||
/>
|
/>
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
|
@ -382,6 +383,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clearSingleSelect(){ // PUBLIC API
|
clearSingleSelect(){ // PUBLIC API
|
||||||
|
this.$emit('on-clear');
|
||||||
if (this.clearable) this.values = [];
|
if (this.clearable) this.values = [];
|
||||||
},
|
},
|
||||||
getOptionData(value){
|
getOptionData(value){
|
||||||
|
|
Loading…
Add table
Reference in a new issue