使用vue3+ts实现一个element-plus中的table组件点击一整行展开子结构

今天写表格的时候遇到了点击一行展开，查看了文档，结果没有发现，然后自己就研究了一下，话不多说，直接开搞

el-tab中的代码

        你项目中的是id还是别的，然后这个row-key就写啥

以下代码中官方文档中也有说明

 row-key="id"
 :expand-row-keys="expands"
//当某一行被点击时会触发该事件
 @row-click="clickRowHandle"

方法：

//先引入ref
    import {ref} from 'vue'
//声明一个expands
    const expands = ref([])

//点击事件
const clickRowHandle = (row: { id: any }) => {

      if (expands.value.includes(row.id)) {
        expands.value = expands.value.filter(val => val !== row.id)
      }
      else {
        expands.value.push(row.id)
      }
    }

还有一个隐藏小三角的

给他设置width="0"就好了
<el-table-column type="expand" width="1">

好了，今天就先到这里吧