essage

to{/home/message/detail/${id}/${title}}params传递数据/Link2.注册路由(声明接收):

Route

path/home/message/detail/:id/:title

const

to{/home/message/detail/?id${id}title${title}}

search传递数据

qs.parse(this.props.location.search.slice(1))备注:

需要借助qs.parse()解析

to{{pathname/home/message/detail,state:{id,title}}}

state传递参数

借助this.props.history对象上的API对操作路由跳转,前进,后退

-this.props.history.goForward()

state

this.props.history.push(/home/message/detail/${this.state.id}/${this.state.title})

}clickSearch

this.props.history.replace(/home/message/detail?id${this.state.id}title${this.state.id})

}clickState

this.props.history.replace(/home/message/detail,{id:this.state.id,title:this.state.title})

10.withRouter

声明一个App组件,导出的时候用withRouter包裹一下就行

class

withRouter(App)withRouter可以加工一般组件,让一般组件具备路由组件所特有的API

11.BrowserRouter

1.底层原理不一样:BrowserRouter使用的是H5的history

API.

不兼容IE9及以下版本HashRouter使用的是URL的哈希值2.URL表现形式不一样browserRouter的路径中没有#HashRouter的路径中有#3.刷新后对路由state参数的影响BrowserRouter没有任何影响,因为state保存在history中HashRouter刷新后会导致路由state参数的丢失