I have a simple question. I have a REACTjs application which does some requests to the API when starting. These requests are usually done only once but once in a while, user might want to refresh the application manually.

When performing ctrl+F5 (or refresh the page via browser), it works fine.

I tried adding a button with the same functionality like this to my application:

<button value="Refresh Page" onClick="window.location.reload(true)">Refresh</button>

but it only performs two requests: 0.junk.js and 0.junk.js.map which both returns 304 status.

Is there a way how to achieve the same behavior as refreshing with browser?

I have a simple question. I have a REACTjs application which does some requests to the API when starting. These requests are usually done only once but once in a while, user might want to refresh the application manually.

When performing ctrl+F5 (or refresh the page via browser), it works fine.

I tried adding a button with the same functionality like this to my application:

<button value="Refresh Page" onClick="window.location.reload(true)">Refresh</button>

but it only performs two requests: 0.junk.js and 0.junk.js.map which both returns 304 status.

Is there a way how to achieve the same behavior as refreshing with browser?

• javascript
• reactjs

2 Answers 2

Try calling a function:

onClick={() => window.location.reload(true)}

Or Simply update any state of your main ponent:

this.setState({ refresh: true })

I don't think a string like that is a valid prop you can pass to an onClick. That looks like the way you would do it using plain old html. You would have to pass a function to onClick like <button value="Refresh Page" onClick={() => window.location.reload(true)}>