router-link傳參


果然還好是一小部分一小部分記錄的好。

<router-link :to="info">中:to特性可以是路徑str,也可以是一個對象形式str。

當info是對象時可以攜帶參數:

  1.{path:str,query:{x:a,y:b}},在另一個視圖中可以$route.query.x獲取數據。

  2.{name:pre_name,params:{x:a,y:b}} ,pre_name是routes 配置路由時路由的名字。這里name的意義是對路由的引用。此時params可以攜帶數據到另一個視圖。

  注意:方式1中如果query換成params,是無效的。

   第2種方式相當於router.push({ name: pre_name, params: { userId: 123 }})

另一種傳參方式是動態路由匹配:

  在配置路由時,這你對要復用的組件,比如新聞、通知、游記等需要復用組件的情況:

  const routes = [{ path: '/news/:id/:title', component: news}];

  在頁面<router-link  to="/news/15/新產品開售">直接跳轉

  news視圖中$route.params.id獲取id或title.

  另外,在配置路由的時候可以對動態參數正則:

  const routes = [{ path: '/news/:id(\\d+)/:title', component: news}];


免責聲明!

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



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