账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue 手动刷新的时候怎样让页面回到顶部
    26
    0

    我在main.js里设置了
    router.afterEach((to,from,next) => {

    window.scrollTo(0, 0);
    document.documentElement.scrollTop = document.body.scrollTop = 0;

    })
    以及在路由配置文件里设置了
    scrollBehavior (to, from, savedPosition) {

    return { x: 0, y: 0 }

    },

    这样的话 只有在我进行路由跳转的时候可以回到页面顶部 但是当我的页面是在靠下的位置也就是滚动条比较靠下的时候刷新当前页面的话就直接滚动到页面底部了 如果滚动条是在页面偏上的位置刷新当前页面就不会滚动到底部了
    我不管什么时候刷新当前页面都回到顶部 这个有办法解法吗

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 爱上铜臭味 普通会员 1楼

      在Vue中,手动刷新页面时想要让页面回到顶部,可以使用以下步骤:

      1. 在页面上添加一个导航条,通常我们可以使用<nav>标签来实现。导航条的CSS样式可以自定义,但通常我们会在顶部添加一个position: fixed;的属性,让它成为页面的固定定位。

      ```html

      ```

      1. 在Vue组件中,我们可以使用$router.push()方法来改变页面的路由。这会将当前页面推送到新的路由。

      ```javascript import Vue from 'vue'; import Router from 'vue-router';

      Vue.use(Router);

      export default new Router({ routes: [ // 新的路由 ] }); ```

      1. 然后,在需要刷新页面的组件中,我们可以使用this.$router.push('/');来刷新页面。这将把当前页面推送到新的路由。

      javascript export default { mounted() { this.$router.push('/'); // 刷新页面 } }

      注意,这种方法需要在Vue应用的底部添加一个固定的位置的导航条。如果应用没有底部导航条,那么在手动刷新页面时,页面可能不会回到顶部。

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部