import { Switch, Route, Router } from 'react-router';
import { Swtich, Route, BrowserRouter, HashHistory, Link } from 'react-router-dom';
1, api
React-router:
provides the core api of the route. Such as Router, Route, Switch, etc., but does not provide api; for routing redirection for dom operations
React-router-dom:
provides api such as BrowserRouter, Route, Link, etc., which can trigger events to control routing through dom actions.
Link component, which renders an a tag; BrowserRouter, which uses pushState and popState events to build routes, and HashRouter components, which use hash and hashchange events to build routes.
2, dynamic route hopping
React-router:
this.props.history.push ('/ path') above router4.0 to jump;
this.props.router.push ('/ path') above router3.0 to jump;
React-router-dom:
use this.props.history.push ('/ path') to jump directly
3, differences in use
react-router-dom extends the api of operable dom on the basis of react-router.
both Swtich and Route import the corresponding components from react-router and re-export them without any special treatment.
there is a dependency on react-router in the package.json dependency in react-router-dom, so there is no need for npm to install react-router.
- you can install react-router-dom directly with npm and use its api.