1. 程式人生 > >vue——路由變化頁面資料不重新整理問題

vue——路由變化頁面資料不重新整理問題

每天記錄一點點,把我遇到的問題記錄下來, 希望可以幫助到更多和我遇到同樣問題的人。

問題描述:通過調介面,動態顯示幫助頁面的問題列表, 問題列表有多級,當點選的這個問題沒有下一級問題的時候跳入內容頁。

問題出在,我在電腦上做移動端頁面的時候,相繼跳到詳情頁,我想返回,點選
按鈕,直接跳轉到了如上第一張圖的樣子,no,no,no,這不是我想要的結果,此刻,想到了通過改變url來改變頁面的層級問題。
一級的parent為0,預設不顯示或顯示為如圖:

二級的parent為1,點選一級路由變為如圖:

點選進入下一級頁面的時候,資料會重新整理,但是點選電腦後退時,url最後的parent變為1了,頁面還顯示2的資料,

解決辦法如下:

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]
    }
},

每天進步一點點,希望對您有所幫助。