CODEWITHSUNDEEP
reactjs
Abhishek Roy
Abhishek Roy

Reputation: 75

how do i redirect to root url when i reload a page in react js

App.js

function App(props) {
  console.log(props, "Check Props Here");

  return (
    <div className="d-flex ht-pct-100">
     
      <div className="flex-one">
        
        <div className="flex-one main-content-box" style={{ height: "calc(100% - 55px)" }}>
          <div className="arrow-navigation" style={{ top: topPosition }}></div>
          <Switch>
            <Route exact path="/" render={() => <DashBoard store={main} />} />
            <Route exact path="/newprocess" render={() => <div>DEFG</div>} />

          </Switch>
        </div>
      </div>
    </div>
  );
}

Right now when m clicking on new process it goes to new process page but when i reload the page it stays in the same page. i want to send it to "/" which is the first route. posting the question again for a proper answer. Thanks!

Upvotes: 1

Views: 2212

Answers (1)

Ankit Saxena
Ankit Saxena

Reputation: 1207

The URL will remain same when you refresh the page. It's the browser's behaviour (not related to react js). But you can Programmatically navigate to a specific route using useHistory provided by react-router-dom.

For example:

function MyButton() {
  let history = useHistory();

  function handleClick() {
    history.push("/");
  }

  return (
    <button type="button" onClick={handleClick}>
       New process
    </button>
  );
}

Check here in the offical doc. for more info - Documentation Link

Upvotes: 1

Related Questions