Changing page in react from a function on click

Question

I am using React-router and I want to change page from a function. The function is called onclicking a button in sidebar . I could do it with swapping buttons to a Link tag in react-router. However I want some styles to apply then change the page to render new component. SO how to change page from a function.

I have tried history.push and redirect in react router but both didnt work.

Can you post your code please? history.push is correct, so you might just be calling it wrong. — Colin Burke
– Colin Burke, Commented Jul 10, 2018 at 9:28

Joelgullander · Accepted Answer · 2018-07-10 09:38:10Z

2

<Link /> can be styled aswell, just append a className to it or pass in inline-styling.

If you want to call route in function you need to make sure your component is subscribed to the history prop either by referencing it in the component or passing it down. Then for example:

this.props.history.push('/some/path')

answered Jul 10, 2018 at 9:38

Joelgullander

1,6943 gold badges23 silver badges51 bronze badges

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

Comments

Patrick Ferreira · Accepted Answer · 2018-07-10 09:38:13Z

0

Colin is right history.push shall work. maybe called it with bad params.

You could read this part of the doc, you'll find more detail about it. https://reacttraining.com/react-router/core/api/location

answered Jul 10, 2018 at 9:38

Patrick Ferreira

2,0652 gold badges16 silver badges33 bronze badges

3 Comments

Ayan Banerjee Over a year ago

this.props.history.push says undefined

Patrick Ferreira Over a year ago

could you provide a minimalist snippet with your component and how do you invoke the function / call to history.push ?

Ayan Banerjee Over a year ago

I can but the code has changed a lot since this question.

Collectives™ on Stack Overflow

Changing page in react from a function on click

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related