# day03_react_xiaomi

**Repository Path**: gao-yanfeng/day03_react_xiaomi

## Basic Information

- **Project Name**: day03_react_xiaomi
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-11-23
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 具体使用时通过发送disppatch来进行页面跳转：

```
let param1 = {}
dispatch(push("/path/newpath'", param1));
dispatch(replace("/path/newpath'", param1));
```

#### 使用RouteComponentProps 中的history进行页面回退

一般在完成某种操作，需要返回上一个页面时使用。

```
this.props.history.goBack();  
```

#### 打开一个新的tab页，并截取路径

首先定义路由为 :

```
path: "/pathname/:param1/:param2/:param3",
```

点击事件跳转到新页面 打开一个新的tab：

```
window.open(`pathname/${param1}/${param2}/${param3}`)
```

在新的页面获取路径上的参数：

```
param1:  this.props.match.params.param1, 
param2:  this.props.match.params.param2, 
param3:  this.props.match.params.param3, 
```

获取路径参数 :

```
path?key1=value1&key2=value2
const query = this.props.match.location.search 
const arr = query.split('&')  // ['?key1=value1', '&key2=value2']
const successCount = arr[0].substr(6) // 'value1'
const failedCount = arr[1].substr(6) // 'value2'
```

或者

```
function GetUrlParam(url, paramName) {
　　var arr = url.split("?");

　　if (arr.length > 1) {
　　　　var paramArr= arr[1].split("&");
　　　　var arr;
　　　　for (var i = 0; i < paramArr.length; i++) {
　　　　　　arr = paramArr[i].split("=");

　　　　　　if (arr != null && arr[0] == paramName) {
　　　　　　　　return arr[1];
　　　　　　}
　　　　}
　　　　return "";
　　}else {
　　　　return "";
　　}　
}
```