vue路由,解決同一路由頁面多次觸發不刷新頁面【vue開發】


 
 

vue路由的機制是這樣的:

不同的路由vue會刷新並跳轉到相應路由,但如果是下一個點擊觸發的還是當前路由則當前路由頁面不會被刷新
 
 

要解決的問題是:

很多時候是通過地址傳參觸發同一個頁面就沒法加載不同的數據
 

解決思路:

雖然下一個點擊還是當前路由不會刷新當前路由,但我們知道$route路由數據此時是發生了變化的,比如$route里傳遞的參數信息會隨着每次不同的點擊發生變化,那么我們利用這一點使用vue的watch去檢測這樣的變化然后再重新請求數據請求接口即得到想要的數據
 
 
... ...
 
watch: {
  // 利用watch方法檢測路由變化:
  '$route': function (to, from) {
    // 拿到目標參數 to.query.id 去再次請求數據接口
    this.loadPageData(to.query.id)
  }
}
... ...

 

 

擴展知識:

$route是什么?
$route理解為當前正在跳轉的路由對象,可以從兩個形參to與from得到目標路由與上一個路由相關數據對象(傳遞的參數 path等)
 
 
 
 
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM