react 路由4 学习

表单控件

受控表单组件
非受控的表单组件

demo:收集表单提交的数据

路由(V4)  特点:一切皆是组件
官网:https://reacttraining.com/react-router/
npm i react-router-dom

hash(HashRouter)  history(BrowserRouter)

1)Router把根组件包裹起来
2)Route 对象就是路由对象就可以切组件
<Route path="路径" component={组件名字} />
3)设置路由的链接NavLink(选中的时候有样式) 或 Link 最重要的属性是to

Switch作用是匹配的元素只显示第一个

exact精确匹配路由

Redirect 强制跳转  from 指定来自那个路由
                    to  跳转到那个路由

<Route path="/" exact component={One} />
可以跳转 ,但是NavLink不会加样式

<Redirect from ="/" to ="/one" exact />
404页面的匹配要放在最后面
<Route component={组件的名字} />

子路由

设置方法同父级相同

可以用this.props.match.url添加匹配的路径

componentWillReceiveProps(nextProps)
动态的拿路由的参数

猜你喜欢

转载自www.cnblogs.com/l8l8/p/9470968.html