鍍金池/ 問答/HTML/ Vue刷新當(dāng)前路由,有什么好的解決方式么?

Vue刷新當(dāng)前路由,有什么好的解決方式么?

this.$router.go(0);
location.reload() 
//這兩種方式都相當(dāng)于f5刷新,頁(yè)面會(huì)有卡頓的情況
this.$router.push({ path: '/kong', query: {} });
// 這種方式是進(jìn)入一個(gè)空白頁(yè),在空白頁(yè)里面跳轉(zhuǎn)回原來的頁(yè)面,這種方式頁(yè)面刷新相對(duì)流暢,
// 但是我發(fā)現(xiàn),使用這種方式的話,在用戶點(diǎn)擊瀏覽器的后退鍵的時(shí)候,會(huì)再次進(jìn)入/kong 這個(gè)空白頁(yè)然后馬上回來
// 導(dǎo)致頁(yè)面無法后退

請(qǐng)問,有其他好的方式實(shí)現(xiàn)頁(yè)面刷新嗎?

回答
編輯回答
兔寶寶
vm.$forceUpdate()
示例:
迫使 Vue 實(shí)例重新渲染。注意它僅僅影響實(shí)例本身和插入插槽內(nèi)容的子組件,而不是所有子組件。

或許你需要這個(gè)?(只是在文檔看到,我也沒用過。)

2017年9月13日 19:43
編輯回答
傻丟丟

從api上可能沒有,但是我覺得加 <transation>過度動(dòng)畫是個(gè)好辦法,
如果是頁(yè)面加載量導(dǎo)致渲染比較慢,考慮按需加載吧

2018年3月28日 01:40
編輯回答
離魂曲

感覺你可以看一下這個(gè)issue

但是尤大提的方法可能不滿足你的需求,如果你和我一樣,希望能從breforeCreate開始重走整個(gè)生命周期的話
其實(shí)在你的這個(gè)方法上略作修改就可以

this.$router.push({ path: '/kong', query: {} });

push換成replace
同樣的kong這個(gè)頁(yè)面里beforeRouteEnter時(shí)也用replace
就不會(huì)有那個(gè)后退的問題了

附上我用的代碼吧

// 使用頁(yè)面
refresh () {
  this.$router.replace({
    path: '/refresh',
    query: {
      t: Date.now()
    }
  })
}

// refresh.vue
<script>
export default {
  beforeRouteEnter(to, from, next) {
    next(vm => {
      vm.$router.replace(from.path)
    })
  }
}
</script>
2017年11月11日 07:23
編輯回答
耍太極

有一種騷操作,就是當(dāng)前路由頁(yè)面的最外層 用v-if=“ifreload”.
ifreload 默認(rèn)為true;這時(shí)候這個(gè)頁(yè)面的dom是正常渲染的。
當(dāng)你需要刷新的時(shí)候,直接 this.ifreload=false;然后再ifreload=true;
當(dāng)你ifreload=false的時(shí)候,頁(yè)面的dom都被清除掉了。ifreload=true又重新渲染。就可以刷新本頁(yè)。瀏覽器的回退也沒有影響。

2018年5月7日 22:52