精华内容
下载资源
问答
  • 本篇文章主要介绍了vue通过路由实现页面刷新的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
  • 下面小编就为大家分享一篇解决vue 路由变化页面数据不刷新的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 主要介绍了vue路由传参页面刷新参数丢失问题解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
  • Vue 路由切换时页面刷新页面

    万次阅读 2019-11-28 19:55:32
    第二次进入页面页面路由参数已经改变,但是页面内容不会刷新。 问题原因:在组件mounted钩子中调用的刷新页面内容,但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep-alive>: <template&...

    第二次进入页面,页面路由参数已经改变,但是页面内容不会刷新。

    问题原因:在组件mounted钩子中调用的刷新页面内容,但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep-alive>:

    <template>
      <div id="app">
        <keep-alive>
          <router-view></router-view>
        </keep-alive>
      </div>
    </template>
    keep-alive是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。这就是问题所在了。

    解决办法:

    使用Vue组件切换过程钩子activated(keep-alive组件激活时调用),而不是挂载钩子mounted:

    
    <script>
    export default {
      // ...
      activated: function() {
        this.getCase()
      }
    }
    </script>
    • 列表页面被缓存 第二次返回详情页面数据还显示上一次编辑时保存的数据,actived钩子里面重新调用一下获取详情的方法
    • 页面第一次进来时生命周期执行顺序 create mounted actived
    • 第二次进来只执行actived钩子

     

     

    展开全文
  • 主要介绍了vue实现路由不变的情况下,刷新页面操作,结合实例形式分析了vue路由不变的情况下刷新页面具体原理、操作方法与相关注意事项,需要的朋友可以参考下
  • vue路由跳转刷新页面

    2021-04-20 15:42:20
    路由跳转后地图上的数据不显示。 2 . 直接刷新整个页面。 首先呢,这次的bug是因为首页的地图显示出来了,可是地图上的数据没显示出来,而地图两边的前端数据又正常显示了。没有报错,根据警告上看是因为地图渲染...

    1 . 路由跳转后地图上的数据不显示。
    2 . 直接刷新整个页面。

    首先呢,这次的bug是因为首页的地图显示出来了,可是地图上的数据没显示出来,而地图两边的前端数据又正常显示了。没有报错,根据警告上看是因为地图渲染层的原因。公司的gis不会改,就只有前端强制刷新了。
    直接上代码

    首页路由

              <div class="imgURL1" @click='toView("/ConstructionSupervision")'><p>施工管理</p></div>
    
    
    methods: {
        /**
         * @toView: 跳转路由
         * @param {String} path 路由地址
         * @return:
         */
        toView(path) {
          this.$router.push({
            path: path,
            // name:path
          });
        },
      }
    

    所跳转的路由页面

        <el-button
                          size="small"
                          class="btn-search"
                          @click="toView()"
                      >返回首页
                      </el-button>
    

    这里的判断是重点aboutRoute == ‘/About’,如果不加判断,正常的操作下可以返回首页就直接刷新,正常显示。但是会在所跳转的页面,我这里是表格页,也就是表格页中直接刷新浏览器就回不去了,怎么点击返回首页它都会在表格页原地踏步,哪儿也跳不了

      methods: {
        //路由跳转
        toView() {
          console.log()
          let self = this
          self.$router.push({path: "/About"});
          let aboutRoute = self.$route.fullPath
          if (aboutRoute == '/About') {
            window.location.reload();
          }
        },
      }
    
    展开全文
  • 主要介绍了vue页面实现当前页面刷新跳转时提示保存,在当前页面刷新跳转时提示保存并可取消刷新,以防止填写的表单内容丢失,感兴趣的小伙伴们可以参考一下
  • vue 路由跳转页面刷新问题解决

    千次阅读 2020-09-10 16:20:48
    看到浏览器中地址在变。页面却一直更新不动。...这样路由页面就会被嵌套在 layuiminiHomeTabIframe元素下。页面也就会实时更新。 那大家有疑问了。在App.vue中不是有个这样的标签吗。用那个不行..

    看到浏览器中地址在变。页面却一直更新不动。尝试很多方法。在App.vue中 <router-view>增加标识key无效的。可以往下面看

     其实解决这个方案的方法却是很简单。不知道的。却入坑很深。

    那就是在被嵌套的元素标签中增加

    <router-view></router-view>

    这样路由的页面就会被嵌套在  layuiminiHomeTabIframe元素下。页面也就会实时更新。

    那大家有疑问了。在App.vue中不是有个这样的标签吗。用那个不行吗。其实App.vue是页面资源的首加载项,是主组件,页面入口文件。也可以这样说。当vue第一次进行渲染的时候。App.vue才会执行,router-view才会发挥其作用。路由进行切换是异步进行的。所以需要重新定义一个router-view。把组件渲染到router-view容器中

    目前还在探究vue框架。加油陌生人

    展开全文
  • 主要介绍了Vue路由切换页面不更新问题解决方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
  • 因为有的页面数据放在了同一个vue组建中,又因为开启了路由缓存,需要每次进入该页面的时候强制刷新一下页面,保证数据全部清空了,而且并不是每个页面去了都需要刷新,然后我 方法 methods: { flash(){ this....

    因为有的页面数据放在了同一个vue组建中,又因为开启了路由缓存,需要每次进入该页面的时候强制刷新一下页面,保证数据全部清空了,而且并不是每个页面去了都需要刷新,我的解决方法:

    方法

    <div @click="flash">点我</div>
     methods: {
          flash(){
            this.$router.push('/home')
            // this.$router.go(0)   // 第一种方法 不兼容ios系统
            window.location.reload(); // 第二种方法 js原生方法
          },
     }

    两个方法取一种方法就可以了,这两种方法都有一个弊端就是会闪一下屏幕,用户体验没有做到最好

    遇到的问题

    这时候多点击几下发现会出现了一个奇怪的bug,他会先执行刷新,在跳转,导致了跳转后没有执行刷新方法,还有一个bug就是 this.$router.go(0) 不兼容ios系统

    解决

     methods: {
     // 后面想了想,直接用aysnc和await改为同步才是最正确的做法
         async goHome() {
            await this.$router.push('/home/ks')
            // 兼容苹果的刷新
            await window.location.reload();
            // ios不生效
            // this.$router.go(0)
          }
     }

    展开全文
  • vue3项目中,在router.js中写好了路由跳转,但是浏览器显示页面已经跳转,页面却没有刷新而是展示默认页面,需要手动刷新页面才能渲染出跳转后的页面。 通过路由传参跳转界面,页面没有刷新 解决方法:在 router-...
  • 今天小编就为大家分享一篇解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 携带不同参数跳转至当前路由刷新页面并获取该参数 借助空页面实现 例如:由 /detail?id=1 跳转至 /detail?id=2 detail.vue export default { methods: { test() { this.$router.push({ path: '/empty', query...
  • 点击每个栏目(home, stay, study)进行跳转,方法有多种,可以通过a标签,或者 , 此处我采用 事件进行路由跳转: stay 与stay 共用同一份code文件(study 下的 index.vue),只是数据不同。 --layout -- home.vue --...
  • 第二次进入页面页面路由参数已经改变,但是页面内容不会刷新。 问题原因:在组件mounted钩子中调用的刷新页面内容,但测试发现这个钩子没有被调用。后来发现App.vue中使用了<keep>: <router></router> ...
  • Vue 解决路由跳转页面刷新的问题 问题: 通过路由传参跳转界面,页面没有刷新 (或者跳转同一个页面页面刷新) (或者 this.$router.replace || this.$router.push 路由跳转刷新) 解决方法: 在 ...
  • vue路由跳转已打开页面刷新数据

    千次阅读 2020-12-09 17:36:59
    这也会导致一个问题,就是引用相同组件的时候,由于参数不一样不会覆盖原打开的页面而会打开一个重复的页面,只是页面的数据不一样,再点开旧的页面时(B.1)发现数据还是新页面(B.2)的数据,点开旧页面(B.1)不会...
  • 最近用iview-admin做后台管理系统,遇到了个问题,列表页面点击进入详情页面编辑,编辑完成自动跳转到列表页,需要页面重新刷新请求列表(后管就是这么简单粗暴),然并卵~,再次回到列表页页面不会重新刷新;...
  • 主要给大家介绍了关于vue-router跳转时打开新页面的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用vue-router具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
  • 路由里面设置需要缓存的页面 第二步 使用keep-alive属性包裹需要缓存的页面使用v-if判断,为true的是需要缓存的,false是不需要缓存的 第三步 在需要缓存的页面设置导航钩子,在A野区离开将值设置为false保证...
  • 当做一个搜索的组件时候,在搜索框由于是同一路由下的,所以会导致不跳转,这个时候有许多方法,在这里我说一种(只懂一个): 添加:key="$route.fullPath
  •  遇到个需求,要求在同一个path下,通过不同的query实现跳转不同的页面,大概就是下面这个样子: 这样当全路径变化的时候,就会触发跳转了。 BerySteven_shen 原创文章 79获赞 39访问量 6万+ 关注
  • 页面路由跳转传递参数方式: 注意 query里面的不要写对象,写具体的参数,不然传过去下一个页面后,参数刷新就会变成[object,object]。 具体的参数的值先用JSON.stringify转,再接受的时候转回来。 用JSON.parse把...
  • 很简单,在跳转路由下面加上一段这个代码就可以 this.$router.push({ path: `/homeMenuBar/About/aboutIndexs`, query: { id: val.id, }, }); setTimeout(function () { window.location.reload(); }, 100...
  • vue中我们实现从一个页面点击某一项跳转到另外一个页面事使用在点击事件中定义 <card @click.native=“viewMoreRelation(item)” :archive = “item”> viewMoreRelation(row){ var fileLists=[] var map={url...
  • 问题描述:当我使用路由跳转页面时,如果页面跳转是同一个路由,传递的参数不同时,页面刷新, 如下图:待收定金和待收首款其实跳转的是同一个组件 ,只是他们传递的参数不同而已。 当我使用路由进行跳转,我...
  • vue route路由跳转 一进页面刷新

    千次阅读 2019-10-30 11:23:51
    我的需求是日期时间选择器需要实时更新,需要一进...之后路由跳转,一进页面就是刷新,就在需要的页面中加入watch监测即可。 watch:{ $route(to, from) { this.dateTimerange = [new Date().getTime() - 24 * 6...
  • 这也会导致一个问题,就是引用相同组件的时候,由于参数不一样不会覆盖原打开的页面而会打开一个重复的页面,只是页面的数据不一样,再点开旧的页面时(a)发现数据还是新页面(b)的数据,点开旧页面(a)不会调用...
  • 想从添加或者跟新页面跳转回index页面路由跳转回去,怎么使index自动刷新数据呢 在index页面中 加入代码 export default { provide(){ return{ reload:this.reload } }, data() { isRouterAlive:true...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 12,687
精华内容 5,074
关键字:

vue路由跳转时刷新页面

vue 订阅