织梦可以做论坛网站吗,网站联盟平台,公司网站优化,wordpress添加用户页面1、上个图#xff0c;要实现这样的#xff1a; Vxe Table v4.6 官方文档 2、使用 row-config.isCurrent 显示高亮行#xff0c;当前行是唯一的#xff1b;用户操作点击选项时会触发事件 current-change templatedivpvxe-button clicksel… 1、上个图要实现这样的 Vxe Table v4.6 官方文档 2、使用 row-config.isCurrent 显示高亮行当前行是唯一的用户操作点击选项时会触发事件 current-change templatedivpvxe-button clickselectRowEvent设置第二行选中/vxe-buttonvxe-button clickclearSelectEvent取消选中/vxe-buttonvxe-button clickgetCurrentEvent获取高亮行/vxe-button/pvxe-tableborderreftableRefheight300:row-config{isCurrent: true, isHover: true}:datatableDatacurrent-changecurrentChangeEventvxe-column fieldname titleName/vxe-columnvxe-column fieldsex titleSex/vxe-columnvxe-column fieldage titleAge/vxe-columnvxe-column fieldaddress titleAddress show-overflow/vxe-column/vxe-table/div
/templatescript langts setup
import { ref } from vue
import { VXETable, VxeTableInstance, VxeTableEvents } from vxe-tableinterface RowVO {name: stringrole: stringsex: stringage: numbercontent: string
}const tableRef refVxeTableInstanceRowVO()const tableData refRowVO[]([{ name: Test1, role: Develop, sex: Man, age: 28, content: test abc },{ name: Test2, role: Test, sex: Women, age: 41, content: Guangzhou },{ name: Test3, role: PM, sex: Man, age: 32, content: Shanghai },{ name: Test4, role: Designer, sex: Women, age: 24, content: Shanghai }
])const currentChangeEvent: VxeTableEvents.CurrentChangeRowVO ({ rowIndex }) {console.log(行选中事件 ${rowIndex})
}const selectRowEvent () {const $table tableRef.valueif ($table) {$table.setCurrentRow(tableData.value[1])}
}const clearSelectEvent () {const $table tableRef.valueif ($table) {$table.clearCurrentRow()}
}const getCurrentEvent () {const $table tableRef.valueif ($table) {VXETable.modal.alert(JSON.stringify($table.getCurrentRecord()))}
}
/script 3、设置的时候加上这个设置就可以了 :row-config{ isCurrent: true, isHover: true}
