el-selectchange触发事件及clear清空内容触发事件Select 选择器
当选项过多时，使⽤下拉菜单展⽰并选择内容。
为el-select设置clearable属性，则可将选择器清空。需要注意的是，clearable属性仅适⽤于单选。
Select Events
事件名称说明回调参数
change选中值发⽣变化时触发⽬前的选中值
visible-change下拉框出现/隐藏时触发出现则为 true，隐藏则为 false
remove-tag多选模式下移除tag时触发移除的tag值
clear可清空的单选模式下⽤户点击清空按钮时触发—
blur当 input 失去焦点时触发(event: Event)
focus当 input 获得焦点时触发(event: Event)
实例代码：
<el-select v-model="pe" placeholder="请选择" @change="changeValue" clearable @clear="delValue"> <el-option
v-for="item in select1"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<script>
export default {
data() {
return {
ruleForm: {
type: '',
status: '',
pageIndex: 1, // 当前页码
pageSize: 10 // 当前每页显⽰条数
},
total: 0, // 记录总数
select1: [
{
value: 1,
label: ''
},
{
value: 2,
label: '⽀付宝'
},
{
value: 3,
label: '苹果内购'
}
],
tableData: []
}
},
created() {
},
methods: {
// 获取交易流⽔
async getList() {
this.ruleForm.pageIndex = this.ruleForm.pageIndex - 1
let res = await axios.post('/getGoodsList', this.ruleForm)
console.log(res)
this.tableData = res.data.data.data
},
// 选中值发⽣变化时触发
changeValue() {
this.ruleForm.pageIndex = 1
},
记住我
// 点击清空按钮时触发
delValue() {
console.log(11)
}
}
}
</script>
PS：接⼝的 pageIndex 字段是从0开始。