在React搭建的SPA项目中页面的title是直接写在入口index.html中,当路由在切换不同页面时,title是不会动态变化的。那么怎么让title随着路由的切换动态变化呢?
- 在react router中设置:
<Route exact
path={route.path}
render={props => {
document.title = route.title || "默认title"
/>
- 直接在render中设置:
render(){
document.title = "title"
}
- 使用进入路由的时候设置,onEnter()
<Route onEnter={()=>document.title = "title"}
但是onEnter() 函数只有在进入路由的时候才会触发,如果是在子路由间调换是不换触发的。
- 在子路由间跳转的时候设置,onChange()
<Route onChange={()=>document.title = "title"}