el-drawer抽屉滚动条回到顶部

<script setup lang="ts" name="PerformanceLogQuery">
import { ref, nextTick } from "vue";
......
// 详情
import { performanceLogQueryByIdService } from "@/api/performanceLog";
const onDetailClick = async (id: number) => {
  // 获取性能日志详情
  let result = await performanceLogQueryByIdService(id);
  detailData.value = result.data;
  drawerVisible.value = true;
  await nextTick().then(() => {
    // 抽屉滚动条回到顶部
    document.querySelector(".el-drawer__body")?.scrollTo(0, 0);
  });
};
......
</script>

等价写法1：

<script setup lang="ts" name="PerformanceLogQuery">
import { ref, nextTick } from "vue";
......
// 详情
import { performanceLogQueryByIdService } from "@/api/performanceLog";
const onDetailClick = async (id: number) => {
  // 获取性能日志详情
  let result = await performanceLogQueryByIdService(id);
  detailData.value = result.data;
  drawerVisible.value = true;
  await nextTick();
  // 抽屉滚动条回到顶部
  document.querySelector(".el-drawer__body")?.scrollTo(0, 0);
};
......
</script>

等价写法2： 

<script setup lang="ts" name="PerformanceLogQuery">
import { ref, nextTick } from "vue";
......
// 详情
import { performanceLogQueryByIdService } from "@/api/performanceLog";
const onDetailClick = async (id: number) => {
  // 获取性能日志详情
  let result = await performanceLogQueryByIdService(id);
  detailData.value = result.data;
  drawerVisible.value = true;
  nextTick(() => {
    // 抽屉滚动条回到顶部
    document.querySelector(".el-drawer__body")?.scrollTo(0, 0);
  });
};
......
</script>