vue路由對象爲this.$route,下面詳細列一下該對象屬性的詳細信息
屬性名 | 類型 | 讀寫 | 說明 |
$route.path | staring | 只讀 | 當前路由的名字(一般爲#後面的部分,但不包含query查詢值) 如:http://example.com/#/login?name=aa this.$route.path; //輸出“/login” |
$route.query | object | 只讀 | 可訪問攜帶的查詢參數 如:this.$router.push({name: 'login', query:{name: 'you'}}) 此時路由爲:http://example.com/#/login?name=you 可直接訪問this.$route.query.name; //you |
$route.params | object | 只讀 | 路由轉跳攜帶參數 如:this.$route.push({name: 'hello', params: {name: 'you'}) 此時可訪問this.$route.params.name; //you |
$route.hash | string | 只讀 | 當前路徑的哈希值,帶# |
$route.fullPath | string | 只讀 | 完整的路徑值 如:http://example.com/#/login?name=aa this.$toute.fullPath; //輸出“/login?name=aa” |
$route.name | string | 只讀 | 命名路由的 |
$route.matched | array | 只讀 | 當前路由下路由聲明的所有信息,從父路由(如果有)到當前路由爲止 |
$route.redirectedFrom | string | 只讀 | 重定向來源 如:{ path: '*',redirect: {name: 'hello'}} 此時訪問不存在的路由http://example.com/#/a會重定向到hello 在hello訪問this.$route.redirectedFrom; //輸出“/a” |
以上是路由對象的常見屬性,基本的信息都涵蓋了,且親測
有新的再補充吧!