如何解決vue路由變化頁(yè)面數(shù)據(jù)不刷新的問(wèn)題

這篇文章給大家分享的是有關(guān)如何解決vue路由變化頁(yè)面數(shù)據(jù)不刷新的問(wèn)題的內(nèi)容。小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過(guò)來(lái)看看吧。

每天記錄一點(diǎn)點(diǎn)，把我遇到的問(wèn)題記錄下來(lái)， 希望可以幫助到更多和我遇到同樣問(wèn)題的人。

問(wèn)題描述：通過(guò)調(diào)接口，動(dòng)態(tài)顯示幫助頁(yè)面的問(wèn)題列表， 問(wèn)題列表有多級(jí)，當(dāng)點(diǎn)擊的這個(gè)問(wèn)題沒(méi)有下一級(jí)問(wèn)題的時(shí)候跳入內(nèi)容頁(yè)。

問(wèn)題出在，我在電腦上做移動(dòng)端頁(yè)面的時(shí)候，相繼跳到詳情頁(yè)，我想返回，點(diǎn)擊

按鈕，直接跳轉(zhuǎn)到了如上第一張圖的樣子，no,no,no,這不是我想要的結(jié)果，此刻，想到了通過(guò)改變url來(lái)改變頁(yè)面的層級(jí)問(wèn)題。

一級(jí)的parent為0，默認(rèn)不顯示或顯示。

二級(jí)的parent為1，點(diǎn)擊一級(jí)路由變?yōu)槿鐖D：

點(diǎn)擊進(jìn)入下一級(jí)頁(yè)面的時(shí)候，數(shù)據(jù)會(huì)刷新，但是點(diǎn)擊電腦后退時(shí)，url最后的parent變?yōu)?了，頁(yè)面還顯示2的數(shù)據(jù)，

解決辦法如下：

created () {
 console.log(this.getStatus(this.$route.path))
},
 watch: {
 '$route' (to, from) {
  console.log(this.getStatus(this.$route.path))
 }
 },
 methods: {
 getStatus (urlStr) {
  var urlStrArr = urlStr.split('/')
  return urlStrArr[urlStrArr.length - 1]
 }
},

感謝各位的閱讀！關(guān)于“如何解決vue路由變化頁(yè)面數(shù)據(jù)不刷新的問(wèn)題”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！