问题描述
我正在为 VueJs 使用 CoreUI 管理主题。
我正在尝试通过 CoreUI 制作表格。现在我必须使表格的行可点击。
知道如何做到这一点吗?
这里有关于表格的文档: https://coreui.io/vue/docs/components/table.html#cdatatable-api 在 events 下的 CDataTable API 中,它们具有行单击事件。我只是不知道如何使用它。
任何形式的帮助将不胜感激。
解决方法
像这样添加事件监听器
请关注方法中的@row-clicked="rowClickHandler"
和方法rowClickHandler
<template>
<CCardBody>
<CDataTable
:items="items"
:fields="fields"
@row-clicked="rowClickHandler" // <== focus here
>
... Rest of the code
</CDataTable>
</CCardBody>
</template>
<script>
export default {
name: 'AdvancedTables',data () {
return {
items: [],fields: [],}
},methods: {
rowClickHandler ((item,index,column name,event) {
// whatever you want to do
},... other methods
}
}
</script>