react非路由跳转组件获取上下文
react非路由跳转组件获取上下文react非路由跳转组件获取上下文解决方案1.通过路由跳转2.通过属性传递3.通过withRouter包装
react非路由跳转组件获取上下文解决方案
作者：颖 梓
在react组件中，不是所有组件会通过路由跳转，也需要抓取路由上下文时，解决方案
我们可以看到user组件在React Developer Tools管理工具中的props属性中是存在history，location，match这些上下文
,
document.getElementById('root')
//这是我们之前的代码，显然App组件没有通过路由跳转
)
import {BrowserRouter, Route} from 'react-router-dom'
ReactDom.render(
,
document.getElementById('root')
)
//结构出react-router-dom的Router，来实现路由跳转
这样我们就会看到我们的App组件拿到了路由上下文，并且被Route套了起来
这样便会拿到路由上下文
我们也可以直接将props传给ChildA，这样同样可以收到上下文
不过推荐单个属性直接传，毕竟我们的props还有其他属性
import {withRouter} from 'react-router-dom'
class App extends Component{}
export default withRouter(App)
| withRouter | 把不是通过路由切换过来的组件中，将 history、location、match 三个对象传入props对象上 |
|---|
作者：颖 梓
相关文章
Yasmin
2021-05-01
Ebony
2020-10-03
Malinda
2023-05-18
Tani
2023-05-18
Viveka
2023-05-18
Karli
2023-05-18
Tia
2023-05-18
Victoria
2023-05-18
Jacinda
2023-07-20
Viridis
2023-07-20
Nova
2023-07-20
Beth
2023-07-20
Viridis
2023-07-20
Georgia
2023-07-20
Shaine
2023-07-20
Isleta
2023-07-20
Jacinda
2023-07-20