vue配置路由并傳遞參數(shù)

一. 配置路由的 index.js 文件

  • 在router文件夾中新建 index.js 文件

  • 導入vue，vue-router 以及路由模塊

  • 使用路由模塊

  • 導出VueRouter

  • 配置路由

此代碼為一個路由數(shù)組（注意是routes）;
第一項包含redirect參數(shù)，表示默認路徑，其中的query表示路由傳遞的參數(shù)，為object類型;

二. 使用路由

  • 在router-link的標簽中綁定
  • :to="{path:'/sales',query:{type:'All'}}"
    path表示路由路徑,query表示路由傳遞的參數(shù)obj
  • tag='div'
    router-link的標簽頁面中默認渲染為 a標簽，通過這個參數(shù)可改變，此代碼表示渲染為 div 標簽

三. 目標模塊中獲取傳遞參數(shù)

在路由至的目標模塊中，想要獲取通過路由傳遞的參數(shù)
可通過 this.$route.query.type 獲取，如下圖所示

最后編輯于 ：
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

友情鏈接更多精彩內(nèi)容