Vue路由獲取路由引數

2021-09-08 05:21:41 字數 1645 閱讀 9631

vue路由設定路由引數有2種方式：

登入
通過query配置的路徑顯示如下：

註冊
通過query配置的路徑顯示如下：

通過該方法配置的引數，需要在配置路由的時候給引數留個坑，如下圖：

獲取路由引數的方法：

this.$route.query

this.$route.params

doctype html


>


<


html 


lang


="en"


>


<


head


>


<


title


>路由引數


title


>


<


meta 


charset


="utf-8"


>


<


meta 


name


="viewport"


content


="width=device-width, initial-scale=1"


>


head


>


<


body


>


<


div 


id>


div>


<


script 


src=""


>


script


>


<


script 


src="js/vue-router.js"


>


script


>


<


script


>


varlogin =,


}varregister =,


}vue.use(vuerouter);


varrouter 


=new


vuerouter(,


//通過params傳遞的路由引數需要用 :引數名 來佔個坑


]});


var= }"


>


登入<


/router-link>


<


router


-link :to="


}">


註冊<


/router-link>


<


router


-view


><


/router-view>


<


/div>


` }


varvm 


=new


vue(,


template:`


<


><


/});


script


>


body


>


html


>
補充說明：$route:路由資訊物件，唯讀物件；

$router:路由操作物件 ，只寫物件。 

Vue路由 路由配置 傳參 獲取引數

this.route 和 this.router區別 this.route 資訊引數 query prams 傳參獲取 this.router 功能函式，go push 等方法呼叫1.匯入和使用路由 main.js import router from vue router 使用路由 vue.use...

vue 路由跳轉以及引數獲取

路由跳轉 query傳參 this.router.push query傳參 獲取引數 const id this.route.query.id 路由跳轉 params傳參 this.router.push params傳參 獲取引數 const id this.route.params.id 區別 ...

vue路由傳遞引數

1.通過path來確定匹配的路由，通過query來傳遞引數 傳參 golist title,id 注意這裡是 router 接參 this.params.brandid this.route.query.id 這裡是 route2.通過路由屬性name確定匹配路由，通過params傳遞引數 傳參 g...