Comment définir dynamiquement le titre du titre dans un projet React (code)

Le contenu de cet article explique comment définir dynamiquement le titre (code) dans les projets React. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Dans le projet SPA construit avec React, le titre de la page est écrit directement dans l'entrée index.html Lorsque l'itinéraire bascule entre différentes pages, le titre ne changera pas dynamiquement. Alors, comment faire changer le titre de manière dynamique à mesure que l'itinéraire change ?
1. Ajoutez l'attribut title lors de la définition de l'itinéraire.

    {
        path: "/regularinvestment",
        component: Loadable({
            loader: () => import('./../../business/Regularinvestment/index'),
            loading: PageLoading
        }),
        title: "这是自定义的标题"
    }

2. Obtenez le titre personnalisé dans le index.js de l'itinéraire et définissez le titre de la page.

   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}/>
        })
    };

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!