React中關於url中傳參的問題

2021-09-24 08:27:48 字數 1486 閱讀 6579

對於react的url傳參問題,總是一臉懵逼,記錄一下。

比如如下兩個路由

/repos/reactjs/react-router

/repos/vue/vue-router

複製**

我們可以把看作是url中傳了兩個引數,定義如下:

/repos/:username/:reponame

複製**

1、 路由設定

"/repos/:username/:reponame" component=/>

複製**

2、link

"/repos/reactjs/react-router">react router

複製**

3、引數獲取

複製**

js 實現路由的跳轉

在react-router中,一般有兩種方法。

第一種,使用withrouter(),然後將在內部可以獲取this.props.router。

第二種,使用this.context.router,不過在使用前必須定義這個類的contexttypes。

1、 withrouter怎麼用?

withrouter高階元件,提供了history讓你使用~

import react from "react";

import from "react-router-dom";

class mycomponent extends react.component

...}export default withrouter(mycomponent);

複製**

引數獲取

複製**

2、使用 context

react-router v4 在 router 元件中通過contex暴露了乙個router物件~

在子元件中使用context,我們可以獲得router物件,如下面例子~

import react from "react";

import proptypes from "prop-types";

class mycomponent extends react.component

constructor(props, context)

...myfunction

() ...

}複製**

當然,這種方法慎用~盡量不用。因為react不推薦使用contex哦。在未來版本中有可能被拋棄哦。

ref3: react router 使用教程

mvc中獲取url傳參

如果url是 home index?id 3 直接request就ok。但是如果路由設定為 url是 home index 3 這時想在頁面view中獲取引數id的值,該怎麼獲取?查了下資料好多人都利用action獲取到引數值後,用viewdata傳到view中 例如controlers中的phon...

關於URL或JS中的URL傳參中文亂碼問題

i life s 部落格 有乙個頁面,通過js的location.url跳轉 中間傳了幾個條件引數,但這個引數是中文的時候,就出現了亂碼問題 網上搜所,解決方案如下 1.頁面編碼 匯出 function exportexcel 2.action解碼 string word 頁面傳過來的中文引數 st...

URL中含特殊字元傳參

url中如果含有特殊字元,普通的表單提交可能沒有問題,但是像 postman 等介面除錯工具就很可能出現問題 要解決這些問題,我們必須用對應的url編碼值來替換引數中的這些字元 特殊字元 url編碼值 空格 20 22 23 25 26 27 28 29 2b 2c 2f 3a 3b 3c 3d 3...