1. react-router是跨平台的，内置通用组件和通用Hooks
  2. react-router-dom是在react-router基础上提供了Link和NavLink
    1. 依赖的 history库提供了两个浏览器端适用的BrowserRouter和HashRouter
    2. 安装了react-router-dom，npm会解析并安装上述依赖包。可以看到，其中包括react-router

react-router-dom npm包

  1. "dependencies": {
  2.   "history": "^4.7.2",
  3.   "invariant": "^2.2.2",
  4.   "loose-envify": "^1.3.1",
  5.   "prop-types": "^15.5.4",
  6.   "react-router": "^4.2.0",
  7.   "warning": "^3.0.0"
  8. }


hooks方法

  1. useHistory()
  2. useLocation()
  3. useParams()
  4. useRouteMatch()

react-router-dom方法

  1. import {
  2.   BrowserRouter as Router,
  3.   // HashRouter as Router,
  4.   MemoryRouter,
  5.   StaticRouter,
  7.   Router,
  8.   Route,
  9.   Switch,
  11.   Link,
  12.   NavLink,
  13.   Prompt,
  14.   Redirect,
  15.   history,
  16.   location,
  17.   generatePath,
  18.   match,
  19.   withRouter,
  20. } from 'react-router-dom'

react-router和 react-router-dom的区别

  1. react-router 4.x以及之前的版本，叫 react-router
  2. react-router 5之后，将原本的针对网页使用的react-router的npm package命名改为了react-router-dom
  3. 一般都用的react-router-dom代替 react-router，一些常用的组件都封装好了
  4. 最新的react项目直接使用react-router-dom，不用react-router