解決vue 路由變化頁面數(shù)據(jù)不刷新的問題
更新時間：2018年03月13日 08:44:36 作者：毛毛-lucy
下面小編就為大家分享一篇解決vue 路由變化頁面數(shù)據(jù)不刷新的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
每天記錄一點點，把我遇到的問題記錄下來， 希望可以幫助到更多和我遇到同樣問題的人。
問題描述：通過調接口，動態(tài)顯示幫助頁面的問題列表， 問題列表有多級，當點擊的這個問題沒有下一級問題的時候跳入內(nèi)容頁。
問題出在，我在電腦上做移動端頁面的時候，相繼跳到詳情頁，我想返回，點擊
按鈕，直接跳轉到了如上第一張圖的樣子，no,no,no,這不是我想要的結果，此刻，想到了通過改變url來改變頁面的層級問題。
一級的parent為0，默認不顯示或顯示。
二級的parent為1，點擊一級路由變?yōu)槿鐖D：
點擊進入下一級頁面的時候，數(shù)據(jù)會刷新，但是點擊電腦后退時，url最后的parent變?yōu)?了，頁面還顯示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]
}
},
以上這篇解決vue 路由變化頁面數(shù)據(jù)不刷新的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
這篇文章主要介紹了Vue組件和Route的生命周期的相關知識,需要的朋友可以參考下2018-02-02
Mint UI 是 由餓了么前端團隊推出的 一個基于 Vue.js 的移動端組件庫，這篇文章主要介紹了mint-ui在vue中的使用示例，這里整理了詳細的代碼,有需要的小伙伴可以參考下2018-04-04
這篇文章主要給大家介紹了關于vue3點擊不同的菜單頁切換局部頁面實現(xiàn)的相關資料,文中示例代碼介紹的非常詳細,對大家學習或者使用vue3具有一定的參考價值,需要的朋友可以參考下2023-08-08
最近小編遇到這樣的問題，多組關鍵詞，這里實現(xiàn)了關鍵詞的背景色與匹配值的字體顏色值相同，下面通過定義關鍵詞匹配改變字體顏色，本文通過實例代碼給大家介紹的非常詳細，需要的朋友參考下吧2019-07-07
最近因為three.js的項目要用Vue.js,下面這篇文章主要給大家介紹了關于vue中使用three.js報錯的解決方法,文中通過圖文以及示例代碼介紹的非常詳細,需要的朋友可以參考下2022-03-03
當一個頁面需要加載較多個組件時,并且組件自身又比較復雜,如果一次性加載,可能等待時間較長,體驗不好,這個時候就需要延遲加載了,本文為大家介紹了Vue2實現(xiàn)組件延遲加載的示例代碼,需要的可以參考下2024-01-01
Vue.js與 ASP.NET Core 服務端渲染功能整合
本文通過案例給大家詳細分析了ASP.NET Core 與 Vue.js 服務端渲染,需要的朋友可以參考下2017-11-11
Vue3關于響應式數(shù)據(jù)類型詳解(ref、reactive、toRef、及toRefs)
這篇文章主要介紹了Vue3關于響應式數(shù)據(jù)類型(ref、reactive、toRef、以及toRefs),本文結合示例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-01-01
Vue3 elementUI 中 date-picker 使用過程遇到坑
這篇文章主要介紹了Vue3 elementUI 中 date-picker 使用過程遇到坑,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧2023-10-10
Vue瀏覽器鏈接與接口參數(shù)實現(xiàn)加密過程詳解
這篇文章主要介紹了Vue瀏覽器鏈接與接口參數(shù)實現(xiàn)加密過程，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習吧2022-12-12