react跳转传参方式

React中跳转页面并传递参数可以使用React Router。以下是基本示例：

1. 在主页中定义路由：

import { Route, BrowserRouter as Router } from 'react-router-dom';
import Home from './Home';
import Detail from './Detail';

const App = () => (
  
    

      
      
    
  
);

export default App;

1. 在主页中添加链接：

import { Link } from 'react-router-dom';

const Home = () => (
  

    
Home
    

      
Detail 1
      
Detail 2
      
Detail 3
    
  
);

export default Home;

1. 在详情页中获取参数：

import { useParams } from 'react-router-dom';

const Detail = () => {
  let { id } = useParams();
  return (
    

      
Detail {id}
    
  );
}

export default Detail;

此时点击链接会跳转到对应的详情页，并在详情页中显示传递的参数。