scTableSelect 增加change事件

This commit is contained in:
sc 2022-02-28 09:45:40 +08:00
parent c86366b087
commit 361922029f
2 changed files with 12 additions and 6 deletions

View File

@ -1,10 +1,10 @@
<!-- <!--
* @Descripttion: 表格选择器组件 * @Descripttion: 表格选择器组件
* @version: 1.1 * @version: 1.2
* @Author: sakuya * @Author: sakuya
* @Date: 2021年6月10日10:04:07 * @Date: 2021年6月10日10:04:07
* @LastEditors: sakuya * @LastEditors: sakuya
* @LastEditTime: 2021年11月4日16:09:05 * @LastEditTime: 2022年2月28日09:39:03
--> -->
<template> <template>
@ -154,6 +154,7 @@
} }
this.autoCurrentLabel() this.autoCurrentLabel()
this.$emit('update:modelValue', this.defaultValue); this.$emit('update:modelValue', this.defaultValue);
this.$emit('change', this.defaultValue);
}, },
// //
selectAll(rows){ selectAll(rows){
@ -175,6 +176,7 @@
} }
this.autoCurrentLabel() this.autoCurrentLabel()
this.$emit('update:modelValue', this.defaultValue); this.$emit('update:modelValue', this.defaultValue);
this.$emit('change', this.defaultValue);
}, },
click(row){ click(row){
if(this.multiple){ if(this.multiple){
@ -184,6 +186,7 @@
this.$refs.select.blur() this.$refs.select.blur()
this.autoCurrentLabel() this.autoCurrentLabel()
this.$emit('update:modelValue', this.defaultValue); this.$emit('update:modelValue', this.defaultValue);
this.$emit('change', this.defaultValue);
} }
}, },
//tags //tags
@ -216,7 +219,6 @@
focus(){ focus(){
this.$refs.select.focus(); this.$refs.select.focus();
} }
} }
} }
</script> </script>

View File

@ -11,14 +11,14 @@
<el-main> <el-main>
<el-alert title="select深度改造的表格选择器, 非常适用于大量数据选择的场景" type="success" style="margin-bottom:20px;"></el-alert> <el-alert title="select深度改造的表格选择器, 非常适用于大量数据选择的场景" type="success" style="margin-bottom:20px;"></el-alert>
<el-card shadow="never" header="单选"> <el-card shadow="never" header="单选">
<sc-table-select v-model="value2" :apiObj="apiObj" :params="params" :table-width="600" :props="props"> <sc-table-select v-model="value2" :apiObj="apiObj" :params="params" :table-width="600" :props="props" @change="change">
<el-table-column prop="id" label="ID" width="180"></el-table-column> <el-table-column prop="id" label="ID" width="180"></el-table-column>
<el-table-column prop="user" label="姓名"></el-table-column> <el-table-column prop="user" label="姓名"></el-table-column>
</sc-table-select> </sc-table-select>
</el-card> </el-card>
<div style="height:15px"></div> <div style="height:15px"></div>
<el-card shadow="never" header="多选"> <el-card shadow="never" header="多选">
<sc-table-select v-model="value" :apiObj="apiObj" :table-width="700" multiple :props="props"> <sc-table-select v-model="value" :apiObj="apiObj" :table-width="700" multiple :props="props" @change="change">
<template #header="{form, submit}"> <template #header="{form, submit}">
<el-form :inline="true" :model="form"> <el-form :inline="true" :model="form">
<el-form-item> <el-form-item>
@ -82,7 +82,11 @@
}, },
methods: { methods: {
//
change(val){
this.$message('change事件返回详情查看控制台')
console.log(val)
}
} }
} }
</script> </script>