score:1

Accepted answer

with react-router-dom you can create a history object (using the history package) and pass this to the router component. therefore if you create the history object like so and attach this to the window then pass the created history to the app component:

import { createbrowserhistory as createhistory } from "history";

const customhistory = createhistory();
window.customhistory = customhistory;

reactdom.render(
  <app history={customhistory} />,
  document.getelementbyid("root")
);

in the app.js component:

import { router, route, switch } from "react-router-dom";

export default function app({ history }) {
  return (
    <router history={history}>
      <switch>
        <route exact path="/" component={page1 } />
        <route path="/page2" component={page2 } />
        <route path="/page3" component={page3 } />
      </switch>
    </router>
  );
}

now you can use that history object to change the page outside of the application:

$('#link_page2').click(function() {
  console.log('navigating the app to: page1...');
  window.customhistory.push("/page2");
});

Related Query

More Query from same tag