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

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

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue单页项目怎样在发布版本后强制刷新资源?
    64
    0

    问题:vue单页项目怎样在发布版本后提示用户刷新页面?
    单页应用不像普通网站,每次页面跳转都会重新加载资源,用户如果在发布新版本之前打开了页面,并一直停留在页面中没有刷新,那么用户就看不到新版本的内容。

    之前我们的做法是:建一个version.js,在axios中使用请求拦截器,拦截每一个请求,在拦截器中去请求version.js,然后将version.js中的内容去与存在本地的进行比较,如果不一致,则提示用户。
    除了上述方法外,还有别的更好的方法吗?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 嗯还行 普通会员 1楼

      在Vue单页项目中,如果在发布版本后强制刷新资源,可以使用Vue Router的history模式和hash模式。以下是具体的步骤:

      1. 在项目中设置路由: 在你的路由配置文件(如router/index.js)中,设置一个默认的URL和一个用于保存和恢复历史状态的URL。

      javascript // router/index.js export default { routes: [ { path: '/', name: 'Home', component: Home, children: [ { path: '/about', name: 'About', component: About, }, ], }, ], history: { routes: ['/', '/about'], }, saveUrl: '/', savePath: '/about', };

      1. 使用hash模式: 在你的组件中,可以使用Vue Router的router-link组件和router-view组件来实现导航。

      ```html

      About

      ```

      1. 使用history模式: 在你的路由配置文件中,设置一个replace模式,这样当浏览器的URL改变时,Vue Router会自动刷新资源。

      javascript // router/index.js export default { routes: [ { path: '/', name: 'Home', component: Home, children: [ { path: '/about', name: 'About', component: About, }, ], }, ], history: { routes: ['/', '/about'], replace: true, }, saveUrl: '/', savePath: '/about', };

      现在,当用户在浏览器中访问URL时,Vue Router会自动刷新资源,而不是重新加载页面。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部