J'essaie de créer une navigation par onglets avec Ionic (React). Cependant, j'obtiens une erreur étrange - je suppose que cela a quelque chose à voir avec l'attribut href du, mais je ne peux pas lui donner de sens.
L'erreur exacte est la suivante: Impossible de lire la propriété 'startsWith' de undefined - return props.currentPath.startsWith (href);
Toute idée est très appréciée.
TabRoot.js:
<Router>
<div className="App">
<Switch>
<Route exact path='/' component={TabRoot}></Route>
</Switch>
</div>
</Router>
App.js:
<IonRouterOutlet>
<Route path="/:tab(tab1)" component={NewsPage} exact></Route>
<Route path="/:tab(tab2)" component={TranslatorPage} exact></Route>
<Route path="/:tab(tab3)" component={ConverterPage} exact></Route>
</IonRouterOutlet>
<IonTabBar slot="bottom">
<IonTabButton tab="news" href="/tab1">
<IonIcon name="flash"></IonIcon>
</IonTabButton>
<IonTabButton tab="translator" href="/tab2">
<IonIcon name="git-compare" />
</IonTabButton>
<IonTabButton tab="converter" href="/tab3">
<IonIcon name="cash"></IonIcon>
</IonTabButton>
</IonTabBar>
4 Réponses :
La réinstallation du modèle de démarrage des onglets Ionic a résolu le problème.
Qu'entendez-vous par réinstaller le modèle de démarrage? Re-le télécharger? npm install ?
Oui, réexécution de l' npm install
Je vous recommande de consulter cette démo de réaction ionique https://github.com/mehulmpt/ionic-react-demo et cette vidéo youtube https://www.youtube.com/watch?v=OmrPhSEdVPI
salut, merci pour votre réponse. Heureusement, la réinstallation du modèle de démarrage des onglets ioniques a résolu le problème (comme mentionné ci-dessus)
J'ai eu le même problème et je l'ai résolu en remplaçant <Router> (importé { BrowserRouter as Router } from react-router-dom ) par <IonReactRouter> (importé de @ionic/react-router ).
Dans mon cas, c'était un problème de ressources, en faisant:
cordova-res
Résolvez mon problème
Références: Issue