在React搭建的SPA項目中頁面的title是直接寫在入口index.html中,當路由在切換不用頁面時,title是不會動態變化的。那么怎么讓title隨著路由的切換動態變化呢?
1.在定義路由時增加title屬性。
{ path: "/regularinvestment", component: Loadable({ loader: () => import('./../../business/Regularinvestment/index'), loading: PageLoading }), title: "這是自定義的標題" }
2.在路由的index.js獲取到自定義的title設置頁面標題即可。
const RouteWithSubRoutes = route => { return ( <Route exact path={route.path} render={props => { document.title = route.title || "默認title"; return <route.component {...props} routes={route.routes}></route.component> }} /> ); }; export default () => { return allRouters.map((route, i) => { return <RouteWithSubRoutes key={i} {...route}/> }) };
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持VeVb武林網。
新聞熱點
疑難解答