javascript - reactJS history push returns an error - Stack Overflow

admin管理员组

文章数量:1389903

Hi in my reactJS application I use this

this.props.history.push("URL");

to redirect to another page or to the same page when I want to reload the page.

But I got this error:

Hash history cannot PUSH the same path; a new entry will not be added to the history stack

how can I solve this issue?

thanks in advance

Hi in my reactJS application I use this

this.props.history.push("URL");

to redirect to another page or to the same page when I want to reload the page.

But I got this error:

Hash history cannot PUSH the same path; a new entry will not be added to the history stack

how can I solve this issue?

thanks in advance

• javascript
• reactjs

Share Improve this question Follow asked Mar 16, 2018 at 6:49 FelixFelix 5,6261414 gold badges8080 silver badges173173 bronze badges 2

• check this question stackoverflow./questions/44121069/… – Suresh Ponnukalai Commented Mar 16, 2018 at 6:52
• Is it warning or an error? Seems like warning to me. If I'm not mistaken, the warning is shown only on dev mode but not in production. Just check if new location is the same as current one const {history} = this.props; if(history.pathname !== newPath) history.push(newPath); – Eduard Jacko Commented Jul 12, 2018 at 7:38

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

I think you are looking for this

   this.props.history.push({
         pathname: "URL"
      })

You can use

if (history.location.pathname !== somePath) history.push(somePath);

Here somePath could be any url. In react-router-4, pathname can be accessed like

  this.props.history.location.pathname

You can use replace prop. When replace prop is true, clicking the link will replace the current entry in the history stack instead of adding a new one. To get current pathname use props.location.

<Link replace={to === location.pathname} to={to}><Button>{to}</Button></Link>

You can create higher order function and wrap your <Link> in it. So you can use it as

<NavLink to="{to}"></NavLink> 

Here is tutorial and example (my blog)

本文标签： javascriptreactJS history push returns an errorStack Overflow