A brief discussion on the use of react-router HashRouter and BrowserRouter

The official website recommends BrowserRouter, but this method requires server cooperation. And a bit bad is that redirect can only reach the home page and cannot stay on the current page. The specific usage is very simple, give an example.

HashRouter

// react-router requires only one word node//The Link and Route inside the router will match one by one, and the corresponding components will be loaded if the match is applied.//The path of to and Route is the same (except/end)//For example, click on the corresponding path="/aboutUs/" of to="/aboutUs" to="/aboutUs/", so that it will load the AboutUs component, and other components are not loaded.// Compared to using state and callback, this method is simpler and clearer, and the browsing forward and backward functions are supported.&lt;HashRouter&gt;
  &lt;div &gt;
    &lt;Header /&gt;
    &lt;ul className="nav navbar-nav"&gt;
      &lt;li&gt;&lt;Link to="/"&gt;front page&lt;/Link&gt;&lt;/li&gt;
      &lt;li&gt;&lt;Link to="/classifiedDisplay"&gt;Classification display&lt;/Link&gt;&lt;/li&gt;
      &lt;li&gt;&lt;Link to="/boutiqueCase"&gt;Premium cases&lt;/Link&gt;&lt;/li&gt;
      &lt;li&gt;&lt;Link to="/aboutUs"&gt;about Us&lt;/Link&gt;&lt;/li&gt;
    &lt;/ul&gt;
    &lt;Route exact path="/" component={Home}/&gt;
    &lt;Route exact path="/classifiedDisplay/" component={TypeShow}/&gt;
    &lt;Route exact path="/boutiqueCase/" component={JpShow}/&gt;
    &lt;Route exact path="/aboutUs/" component={AboutUs}/&gt;
    &lt;Footer /&gt;
  &lt;/div&gt;
&lt;/HashRouter&gt;

BrowserRouter

front end

The same code as above, just replace HashRouter with BrowserRouter component.

server

Taking apache as an example, .htaccess adds rewrite rules. (Rewriteable settings need to be enabled first)

#Compare react-router, ignore the written low rulesRewriteEngine on
RewriteRule classifiedDisplay$ /
RewriteRule boutiqueCase$ /
RewriteRule aboutUs$ /

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.