Apakah beberapa cara untuk melompat dalam laluan tindak balas?

Kaedah: 1. Gunakan params, parameter akan dipaparkan dalam bar alamat, sintaksnya ialah "...({pathname:...,search:address bar data})"; nyatakan, lihat dalam bar alamat Tiada data, sintaks "...({pathname:...,state:{test:...}}".

Tutorial ini mengendalikan Persekitaran: sistem Windows 10, react versi 17.0.1, komputer Dell G3

Apakah beberapa kaedah lompat penghalaan bertindak balas

Nota. : react-router-dom yang digunakan di sini Ia adalah versi 5 atau ke atas Borang penghalaan ialah history alamat dokumen
react-router-dom, dengan alamat github bagi pakej bergantung history ialah

<.>1. borang, selepas routing jump , parameter akan dipaparkan dalam bar alamat params

Cara untuk melompat adalah dengan menggunakan
• , di mana nilai yang sepadan dengan kunci history.push({pathname: '/personal', search: 'test=22222'}) disambungkan ke dalam data Lajur alamat search

  import React from 'react'import { useHistory } from 'react-router-dom'export default ()=> {
  	const history = useHistory()
  	// 页面跳转方法
  	history.push({pathname: '/personal', search: 'test=22222'})
  	return 123}

ialah kaedah untuk menerima data disimpan dalam
• DapatkanuseLocation search

  import React from 'react'import { useLocation } from 'react-router-dom'export default ()=> {
  	const location = useLocation()
  	// 页面跳转方法
  	console.log(location, 'props')
  	return 123}

  

2. Menggunakan bentuk

, data tidak akan hilang apabila memuat semula halaman dan data tidak akan kelihatan dalam alamat. bar. state

Cara untuk melompat adalah dengan menggunakan

, di mana kekunci
• sepadan Nilai ialah kaedah menerima data yang disambungkan dalam bar alamat history.push({pathname: '/personal', state: {test: 'dashboard'}}) search

  import React from 'react'import { useHistory } from 'react-router-dom'export default ()=> {
  	const history = useHistory()
  	// 页面跳转方法
  	history.push({pathname: '/personal', state: { test: 'dashboard' }})
  	return 123}

  . Data disimpan dalam
dan diperolehi oleh
• useLocationsearch

  import React from 'react'import { useLocation } from 'react-router-dom'export default ()=> {
  	const location = useLocation()
  	// 页面跳转方法
  	console.log(location, 'props')
  	return 123}

  Pembelajaran yang disyorkan: "
tutorial video bertindak balas

"

Atas ialah kandungan terperinci Apakah beberapa cara untuk melompat dalam laluan tindak balas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!