Vue3使用插槽获取列表的行索引

   <template  v-slot="scope">
       
 
    </template>

举个例子，想把表格的某一列放置修改、删除按钮，那么怎样保证点击修改时修改的是当前行的数据，可以用scope.&index来获取当前行的索引，再用此索引得到当前行的id，将这个值作为参数传给修改、删除的参数列表中。

  <el-table :data="tableData"  >
      <el-table-column prop="id" label="序号" width="150" />
      <el-table-column prop="name" label="名称" width="150" />
      <el-table-column prop="type" label="性格" width="150" />
      <el-table-column prop="sex" label="品类" width="150" />
      <el-table-column label="操作" width="300">
     
  //获取当前行的索引
    <template  v-slot="scope">
       <div>
        <el-button @click="toedit(tableData[scope.$index].id)">编辑</el-button>
        <el-button @click="del(tableData[scope.$index].id)">删除</el-button>
       </div>   
   </template>
      </el-table-column>
  </el-table>

记得给个点赞哦