Summary of several commonly used routing jump methods in React

Several commonly used routing jump methods in React

1. Push jump

1. Link components:

You can jump without refreshing the page, and a tag will be rendered, the to attribute is the path to jump, and exact means exact match

import { Link } from 'react-router-dom';
import { Link } from 'apollo/router' // Usage in other projects// Create navigation links using <Link> in the component// 1. Tag-type jump (no transmission parameters)&lt;Link to="/financeMangeView"&gt;To be done&lt;/Link&gt;
// 2. Label-type jump (params transfer)&lt;Link to={`/financeMangeView/detail/${}/${}`}&gt;To be done&lt;/Link&gt;
&lt;Link to='/financeMangeView/detail/01/Information 1'&gt;information&lt;/Link&gt;

// Jump during programming (no transfer to parameters)("/home/detail")
// Jump during programming (state transfer)("/home/detail",{id:"01",title:"Information 1"})

2. Replace jump

// Tag-type jump (no transmission parameters)&lt;Link replace to='/home/detail/'&gt;information&lt;/Link&gt;
// Tag-type jump (params transfer)&lt;Link replace to='/home/detail/01/Information 1'&gt;information&lt;/Link&gt;
// Jump during programming (no transfer to parameters)("/home/detail")
// Jump during programming (state transfer)("/home/detail",{id:"01",title:"Information 1"})

3. goBack jump (rewind)

()

4. GoForward jump (forward)

()

5. Go jump (jump forward or backward to specify the number of steps)

(num)

Replenish:

Several ways to jump React pages

Method 1: History jumps in the original window

("Your url suffix path does not contain domain name")
//for example ("/swagger/project/detail/"+projectId)

Method 2: Open a new jump window

let url =  + "/detail/" + projectId;
(url) //HereurlIt's the full path

Method 3: Use the <a> tag and jump to the original window

<a href="The URL you want to jump does not contain the domain name">Project list</a>

This is the end of this article about several commonly used routing jump methods in React. For more related React routing jump content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!