recherche

Maison  >  Questions et réponses  >  le corps du texte

Est-il possible de définir une route par défaut dans React-Router ?

<p>Supposons que l'URL de base de mon application soit <em>example.com/app</em></p> <p>Est-il possible de configurer des routes de base dans React-Router au lieu d'écrire toutes les routes sous la forme </p> <pre class="brush:php;toolbar:false;">/app/a /app/b /app/c</pre> <p>Je peux les spécifier comme</p> <pre class="brush:php;toolbar:false;">a b c&Lt ;/pré> ; <p>J'ai essayé l'exemple suivant trouvé dans la documentation mais cela ne fonctionne pas (la page n'affichera rien). C'est peut-être parce que j'utilise réagir-router@3.0.0-alpha.1 ou que je fais quelque chose de mal. </p> <pre class="brush:php;toolbar:false;">importer { useRouterHistory } depuis 'react-router' importer { createHistory } depuis 'historique' const history = useRouterHistory(createHistory)({ nom de base : '/app' }) const Racine = ({magasin}) => <Magasin du fournisseur={magasin}> <Historique du routeur={historique}> <Route path='/' composant={App}> ... </Itinéraire> </Routeur> </Fournisseur> )</pré> <p><br /></p>
P粉128563140P粉128563140456 Il y a quelques jours488

répondre à tous(2)je répondrai

  • P粉087074897

    P粉0870748972023-08-28 16:11:51

    Si vous souhaitez utiliser ,它可以让您访问历史对象,允许您通过history.push('/my-path')更改页面 code>直接来自js的方法。您将面临这样的问题:BrowserRouter 没有可用的 history 属性,并且 Router 没有可用的 basename .

    La solution est la suivante :

    const App: React.FC = () => {
      // do not put a slash at the end of the basename value.
      const history = createBrowserHistory({ basename: '/your-base-name' });
    
      return <Router history={history}>
               ...
             </Router>;
    }
    

    https://reacttraining.com/react-router/web/ api/BrowserRouter/basename-string

    répondre
    0
  • P粉647449444

    P粉6474494442023-08-28 00:10:44

    Avec le dernier react router (v4), vous pouvez le faire facilement

    <BrowserRouter basename="/calendar">
      <Link to="/today"/> // renders <a href="/calendar/today">
    </BrowserRouter>

    répondre
    0
  • Annulerrépondre