elementUI点击表格数据携带参数跳转

Element UI提供了一个表格组件`el-table`，它通常通过`@click`事件处理程序结合`router-link`或者`axios`来实现数据行的点击操作并携带参数跳转。下面是一个简单的示例：

<template>
  <el-table :data="tableData" @click="handleRowClick">
    <!-- 表格列定义 -->
    <el-table-column type="index"></el-table-column>
    <el-table-column prop="name" label="姓名"></el-table-column>
    <!-- ...其他列... -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', id: 1 },
        // ...
      ],
    };
  },
  methods: {
    handleRowClick(row) {
      // 如果你要跳转到详情页，并传递当前行的数据作为参数
      this.$router.push(`/detail/${row.id}`);
      // 或者你可以使用axios发送异步请求
      // this.$http.post('/api/detail', { id: row.id }).then(res => {});
    }
  },
};
</script>

在这个例子中，当用户点击表单中的某一行，`handleRowClick`方法会被触发，它会带当前行的`id`属性去导航到详情页面（如果使用Vue Router），或者向服务器发送包含该ID的请求。