vue router傳遞引數分為倆大類

2021-10-10 16:54:23 字數 1179 閱讀 9355

傳遞的引數分別為倆種型別

字串的方式是直接將路由位址以字串的方式來跳轉,這種方式簡單但不能傳遞引數

this

.$router.

push

("home"

);

想要傳遞引數主要就是以物件的方式來寫,分為兩種方式:命名路由,查詢引數

1. 命名路由

命名路由的前提是在註冊路由的地方給路由命名如

命名路由傳遞引數需要使用params來傳遞,這裡一定要注意使用params不是query。目標頁面接收傳遞引數也要使用params

方法如下:

this.$router.push(})

接收傳遞引數:

this is the news page.the transform param is

}<

/div>

<

/template>

2. 查詢引數

查詢引數就是在路由位址後面帶上引數,和傳統的url引數一致的,傳遞引數使用query而且必須配合path來傳遞引數而不能使用name,目標頁面接收傳遞引數使用query

使用方法如下:

this

.$router.

push(}

);

接收引數如下:

this is the news page.the transform param is

}<

/div>

<

/template>

<

/script>

宣告式的導航和程式設計式的一樣

字串

"news"

>click to news page<

/router-link>

物件

命名路由

"}">click to news page<

/router-link>

2.查詢引數

"}">click to news page<

/router-link>

vue router引數傳遞

準備工作 第一步 建立新的元件profile.vue profile 配置動態路由 傳遞引數主要有兩種型別 配置路由的格式 router id 傳遞的方式 在path後面跟上對應的值 傳遞後形成的路徑 router 123,router abc query的型別 配置路由的格式 router,也就是...

vue router的引數傳遞

1 新建元件 新建乙個user.vue檔案,新增 2 設定對映 開啟index.js檔案,新增如下 1 新建元件 profile.vue,新增如下 h2 p p div template export default script route.query是乙個物件,裡面是頁面傳過來的資料 2 設定對...

vue router傳遞引數的幾種方式

vue router傳遞引數分為兩大類 程式設計式導航傳遞引數有兩種型別 字串 物件。this.router.push home 想要傳遞引數主要就是以物件的方式來寫,分為兩種方式 命名路由 查詢引數,下面分別說明兩種方式的用法和注意事項。命名路由的前提就是在註冊路由的地方需要給路由命名如 命名路由...