vue3使用scrollbehavior用法

在Vue3中，可以使用`scrollBehavior`函数来控制路由切换时的滚动行为。该函数接收三个参数：to、from和savedPosition。其中，to表示目标路由对象，from表示当前路由对象，savedPosition表示滚动位置。

示例代码：

const router = createRouter({
  history: createWebHistory(),
  routes: [
    // 路由配置
  ],
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      // 如果有保存的滚动位置，则直接返回
      return savedPosition;
    } else {
      // 否则返回顶部
      return { top: 0 };
    }
  }
})

在上述代码中，我们定义了一个`scrollBehavior`函数，如果有保存的滚动位置，则直接返回保存的位置，否则返回页面顶部。

除了返回固定的滚动位置外，`scrollBehavior`函数还可以返回Promise，以支持异步滚动。例如：

scrollBehavior(to, from, savedPosition) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve({ left: 0, top: 0 });
    }, 500);
  });
}

在上述代码中，我们使用setTimeout模拟了一个异步滚动的场景。当路由切换时，会等待500ms后再滚动到顶部。