Question

如何基于选定的下拉值和按钮单击重定向来使用React Router Dom重定向组件？

我尝试使用重定向标记，但无法重定向到另一个组件

Answer 1

您需要在onchange函数中使用道具以转到另一页。

this.props.history.push('/my-other-components-url');

Answer 2

react-router的链接组件可用于此：

<Link to="/other-components-url">
    <button>Click Me!</button>
</Link>

任何UI元素都可以嵌套在“链接”组件中，单击该链接将重定向到指定的URL /组件。

有关更多详细信息，请访问： https://knowbody.github.io/react-router-docs/api/Link.html

Answer 3

import React from 'react'
import Button from 'react-bootstrap/Button'
import { Link } from "react-router-dom"; 
import { useParams } from "react-router"; 
export const Parent component ()=>{

return(
  <Link to={"/child" + 12 + " "} >
  <Button className="btn btn-icon btn-round  " >  Redirect   </Button>
    </Link>
)
}

 
 
export const Child component ()=>{
 
 let { id} = useParams();
return(
  <div>hello danish your id is : {id}</div>
)
}

单击按钮时如何重定向到另一个组件？

3 个答案: