vue项目中,滚动条恢复初始位置的方法
    一、使用Vue-router滚动行为:
    你可以使用Vue-router的滚动行为,让每个路由的滚动条恢复到初始位置。
    1、在 router/index.js中添加以下代码:
    const router = new VueRouter({
    mode: 'history',
    scrollBehavior (to, from, savedPosition) {
    return { x: 0, y: 0 }
    },
    routes
    })
    /*
    mode: 'history', 将路由设置为HTML5 History 模式
    scrollBehavior (to, from, savedPosition)定义滚动行为,返回需要滚动到的位置对象
    { x: 0, y: 0 }表示滚动到顶部,如果想滚动到指定的位置,你可以返回{ x: 0, y: 100 },这是表示滚动到 100 像素高度
    */
    2、引入组件,在组件中定义 mounted 事件:
    mounted() {
    this.$nextTick(() => {
    window.scrollTo(0, 0);
    });
    }
    /*
    this.$nextTick表示当组件被挂载完成之后,才会触发函数,window.scrollTo用来将滚动条恢复到初始位置,设置 x 为 0,y 为 0 则表示滚动条恢复到顶部,其他位置同理。
    */
    二、使用 JavaScript 的 scrollTo 方法:
    使用 JavaScript 的 scrollTo 方法,可以在切换到某个页面的时候让滚动条恢复到初始位置。
    1、在 router/index.js 中添加以下代码:
    routes: [
    {
    path: '/',
    component: Home,
    beforeEnter: (to, from, next) => {
    window.scrollTo(0, 0);
    next();
    }
    }
如何设置滚动条的位置    ]
    /*
    在 beforeEnter 中调用 window.scrollTo 方法将滚动条恢复到初始位置,当 beforeEnter 函数执行完毕之后才会跳转到目标路由
    */
    2、在组件中定义 mounted 事件:
    mounted() {
    this.$nextTick(() => {
    window.scrollTo(0, 0);
    });
    }
    /*
    this.$nextTick表示当组件被挂载完成之后,才会触发函数,window.scrollTo用来将滚动条恢复到初始位置,设置 x 为 0,y 为 0 则表示滚动条恢复到顶部,其他位置同理。