React页面间路由跳转方法和传参

页面跳转并传参方法:

import { useHistory } from 'react-router-dom';
function Index(props){
  const history = useHistory()
  const goToAnotherPage = () => {
    history.push({pathname:'/another', query:{name:'Jesse',age:'20'} })
  }
}

另一个页面获取参数的方法:

const [ name, setName ] = useState()
useEffect(()=>{
  let params = props.location.query
  if(params) {
    // 防止刷新丢失数据
    sessionStorage.setItem('pageQueryData', JSON.stringify(params))
  }else{
    params = JSON.parse(sessionStorage.getItem('pageQueryData'))
  }
  if(params && params.name){
    setName(params.name)  
  }
},[props.location.query])
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容