React and React-Router: Routing through function call with params passed into the route instead of clicking <Link>

Question

How does one do routing with params passed into it through function calls in react-router?

For example I have this Link that when click routes to a different url with parameters passed in:

<Link key={category.name} to={`/category/${category.name}`} params={{category: category.name}} >{category.name}</Link>

Suppose I want to simulate what happens when one clicks on the above link through a function call, how does one go about doing this?

clickHandler(){
//What function should be called to do the routing through a function call?

}

Possible duplicate of React-router: How to manually invoke Link? — Héctor Valls
– Héctor Valls, Commented Nov 9, 2017 at 15:13

ChrisR · Accepted Answer · 2017-11-09 16:34:41Z

1

Use the history object.

If the component which renders the Link is rendered by the router, then you have in this.props a history property you can use.

clickHandler(){
    const {
        history
        category // ??
    } = this.props
    history.push(`/category/${category.name}`);
}

answered Nov 9, 2017 at 16:34

ChrisR

3,9981 gold badge18 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1