vue params query傳參使用

2022-06-26 07:45:15 字數 1106 閱讀 8459

宣告式:

程式設計式:router.push(...)

1、router.push使用

router/index.js

export default new router(,

]})

上邊,在路由中為b元件新增兩個引數 name ,age 

a元件,繫結乙個@click事件,跳轉b元件傳參 使用params

}

跳轉b元件啊啊

這時瀏覽器會顯示 :

http://localhost:8080/#/b/xy/22
在看下query  傳值及位址變化

同樣在 router/index.js路由檔案中 不變有兩個引數name,age

在a元件中,之前引數傳遞是通過params,

this.$router.push(});
替換後,query

this.$router.push(});
這時瀏覽器會發現:

http://localhost:8080/#/?name=xy&age=22
通過以上兩種,頁面重新整理後,引數還會保留的。

獲取值有些不相同:

params:this.$route.params.name;

query:this.$route.query.name;

------------------------ 還有種方式--------------------------------------------

使用router-link

跳轉b元件

http://localhost:8080/#/b?name=zzz&age=22
跟  

this.$router.push(...) 是一樣的
跳轉b元件

取值this.$route.params.name

vue params query的用法和區別

1.params 帶過去id 通過this.router.push 由於動態路由也是傳遞params的,所以在 this.router.push 方法中 path不能和params一起使用,否則params將無效。需要用name來指定頁面。及通過路由配置的name屬性訪問 2.query 頁面通過p...

傳值 傳引用 傳指標

收藏 相關概念 c 三種傳遞引數方式 傳引數的值 稱值傳遞,簡稱傳值 傳引數的位址 稱位址傳遞,簡稱為傳址 和引用傳遞 稱為傳引用 相應的函式傳值呼叫,傳址呼叫和傳引用呼叫 形參 實參 函式定義時參數列中的引數稱為形式引數,簡稱形參 函式呼叫時參數列中的引數稱為實際引數,簡稱實參。實參和形參之間的資...

傳值 傳引用 傳指標

相關概念 c 三種傳遞引數方式 傳引數的值 稱值傳遞,簡稱傳值 傳引數的位址 稱位址傳遞,簡稱為傳址 和引用傳遞 稱為傳引用 相應的函式傳值呼叫,傳址呼叫和傳引用呼叫 形參 實參 函式定義時參數列中的引數稱為形式引數,簡稱形參 函式呼叫時參數列中的引數稱為實際引數,簡稱實參。實參和形參之間的資料傳遞...