feat: CustomTable增加多选功能
This commit is contained in:
parent
3cfc33d2c0
commit
d98f7e1dd0
|
@ -50,6 +50,10 @@ export default {
|
||||||
canSelect: {
|
canSelect: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default: true
|
||||||
|
},
|
||||||
|
multiple: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
@ -60,17 +64,24 @@ export default {
|
||||||
methods: {
|
methods: {
|
||||||
// 实现单击选中/反选功能
|
// 实现单击选中/反选功能
|
||||||
customRow(record) {
|
customRow(record) {
|
||||||
|
const key = record[this.rowKey]
|
||||||
return {
|
return {
|
||||||
class: this.innerSelectedRowKeys.includes(record[this.rowKey]) ? 'ant-table-row-selected' : '',
|
class: this.innerSelectedRowKeys.includes(key) ? 'ant-table-row-selected' : '',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
if(!this.canSelect) {
|
if(!this.canSelect) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (this.innerSelectedRowKeys.includes(record[this.rowKey])) {
|
if (this.innerSelectedRowKeys.includes(key)) {
|
||||||
this.innerSelectedRowKeys = []
|
const findIndex = this.innerSelectedRowKeys.findIndex(k => k == key)
|
||||||
|
this.innerSelectedRowKeys.splice(findIndex, 1)
|
||||||
} else {
|
} else {
|
||||||
this.innerSelectedRowKeys = [record[this.rowKey]]
|
if(this.multiple) {
|
||||||
|
this.innerSelectedRowKeys.push(key)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.innerSelectedRowKeys = [key]
|
||||||
|
}
|
||||||
}
|
}
|
||||||
this.$emit('update:selectedRowKeys', this.innerSelectedRowKeys)
|
this.$emit('update:selectedRowKeys', this.innerSelectedRowKeys)
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user