v-table 搜索后数据自动滑轮自动滚到可视范围内

您可以使用 JavaScript 中的 `scrollIntoView()` 方法来将滚动条滚动到某个元素的位置。例如，如果您想将一个具有特定 ID 的元素滚动到可视范围内，您可以使用以下代码：

document.getElementById("yourElementId").scrollIntoView();

如果您想要在 v-table 中使用此方法，您可以在表格中的行元素上绑定一个 click 事件，然后在事件处理程序中使用上述代码将行元素滚动到可视范围内。以下是一个示例：

<template>
  <div>
    <v-data-table :items="items">
      <template v-slot:body="{ items }">
        <tbody>
          <tr v-for="item in items" :key="item.id" @click="scrollToRow(item.id)">
            <td>{{ item.name }}</td>
            <td>{{ item.age }}</td>
            <td>{{ item.email }}</td>
          </tr>
        </tbody>
      </template>
    </v-data-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, name: "John Doe", age: 30, email: "johndoe@example.com" },
        { id: 2, name: "Jane Smith", age: 25, email: "janesmith@example.com" },
        { id: 3, name: "Bob Johnson", age: 40, email: "bobjohnson@example.com" }
      ]
    };
  },
  methods: {
    scrollToRow(id) {
      document.getElementById(`row-${id}`).scrollIntoView();
    }
  }
};
</script>

在上面的示例中，每个行元素都具有一个唯一的 ID，该 ID 可以帮助我们找到要滚动到的行元素。在 `scrollToRow()` 方法中，我们使用 `scrollIntoView()` 将行元素滚动到可视范围内。