先说结论:
二者的最大区别就是hashRouter不支持location.key 、location.state。
举例说明:
homepage
this.props.history.push({
pathname:'/about',
state:{
msg:'this is a msg from home'
}
})
aboutpage
console.log(JSON.stringify(this.props.location.state));
使用hash路由:
//第一次加载aboutpage
//{msg: 'this is a msg from home'}
//刷新页面后
//undefined
使用browser路由:
//第一次加载aboutpage
//{msg: 'this is a msg from home'}
//刷新页面后
//{msg: 'this is a msg from home'}
原理:
当我们通过state传递参数的时候,因为hashRouter没有使用html5中history的api,无法从历史记录中获取到key和state值,所以当刷新路由后state值会丢失导致页面显示异常。