vue-router路由對象屬性

vue路由對象爲this.$route,下面詳細列一下該對象屬性的詳細信息

屬性名類型讀寫說明
$route.pathstaring只讀

當前路由的名字(一般爲#後面的部分,但不包含query查詢值)

如:http://example.com/#/login?name=aa

this.$route.path;    //輸出“/login”

$route.queryobject只讀

可訪問攜帶的查詢參數

如:this.$router.push({name: 'login', query:{name: 'you'}})

此時路由爲:http://example.com/#/login?name=you

可直接訪問this.$route.query.name;    //you

$route.paramsobject只讀

路由轉跳攜帶參數

如:this.$route.push({name: 'hello', params: {name: 'you'})

此時可訪問this.$route.params.name;    //you

$route.hashstring只讀當前路徑的哈希值,帶#
$route.fullPathstring只讀

完整的路徑值

如:http://example.com/#/login?name=aa

this.$toute.fullPath;    //輸出“/login?name=aa”

$route.namestring只讀命名路由的
$route.matchedarray只讀

當前路由下路由聲明的所有信息,從父路由(如果有)到當前路由爲止

$route.redirectedFromstring只讀

重定向來源

如:{ path: '*',redirect: {name: 'hello'}}

此時訪問不存在的路由http://example.com/#/a會重定向到hello

在hello訪問this.$route.redirectedFrom;    //輸出“/a”

以上是路由對象的常見屬性,基本的信息都涵蓋了,且親測

有新的再補充吧!

發佈了51 篇原創文章 · 獲贊 23 · 訪問量 14萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章