vue表格内容点击跳转

要实现表格内容的点击跳转，你可以在表格的每一行中增加一个点击事件。在点击事件中，可以通过路由跳转到指定的页面。以下是一个简单的示例代码：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>编号</th>
          <th>姓名</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(item, index) in tableData" :key="index" @click="goToDetail(item.id)">
          <td>{{ item.id }}</td>
          <td>{{ item.name }}</td>
          <td><button @click="deleteItem(index)">删除</button></td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { id: 1, name: '张三' },
        { id: 2, name: '李四' },
        { id: 3, name: '王五' },
      ],
    };
  },
  methods: {
    goToDetail(id) {
      this.$router.push(`/detail/${id}`);
    },
    deleteItem(index) {
      this.tableData.splice(index, 1);
    },
  },
};
</script>

在上面的代码中，我们给每一行的 `<tr>` 标签增加了 `@click="goToDetail(item.id)"`，这样当用户点击表格某一行时，就会触发 `goToDetail` 方法，并且将该行的 id 作为参数传入。在 `goToDetail` 方法中，我们使用 `$router.push` 方法进行路由跳转，将用户跳转到指定的详情页面。当然，你需要在路由配置中添加对应的路由规则。