Je travaille sur un projet mais je suis coincé dans le routage. Je veux naviguer d'un composant à un autre mais je ne veux pas changer l'URL de la page Par exemple: si c'est http: // localhost: 3000 / donc ce sera ceci après avoir cliqué sur le lien ou le bouton il n'ira pas à http: // localhost: 3000 / yourEnteredpath . J'espère que vous comprenez mon problème sinon contactez-moi sur mon courrier. Et chers utilisateurs, faites vite le plus vite possible car je n'ai pas assez de temps pour travailler sur cette date limite pour ce projet dans seulement 3 jours. Merci !! Pour votre temps précieux
3 Réponses :
Un moyen simple consiste à effectuer le rendu conditionnel des composants tout en étant sur la même page. Cela ne changera pas l'URL et chargera également le deuxième composant que vous souhaitez afficher. Par exemple:
function Greeting(props) {
const isLoggedIn = props.isLoggedIn;
if (isLoggedIn) {
return <UserGreeting />;
}
return <GuestGreeting />;
}
Je ne sais pas pourquoi vous ne souhaitez pas utiliser le routage et le chemin. Ce serait la meilleure approche à mon avis.
Mais pour répondre à la question, vous pouvez le faire en définissant une variable d'état dans laquelle le composant doit être rendu.
Je ne sais pas si vous utilisez des hooks ou l'ancien état défini, mais dans les deux cas, vous pouvez avoir un composant parent qui restitue les composants enfants en fonction de l'état sélectionné.
Ainsi, lorsque vous cliquez sur le bouton, vous définissez simplement l'état d'affichage de l'autre composant.
Vous pouvez avoir quelque chose comme ça dans votre composant parent.
switch (selected) {
case 'componentA':
return <ComponentA />;
case 'componentB':
return <ComponentB />;
case 'componentC':
return <ComponentC />;
default:
break;
}
};
puis dans le bouton que vous définiriezSelected ('componentA') ou ainsi. p>
si vous utilisez set state serait quelque chose comme setState ({selected: 'componentA'})
https://reacttraining.com/react-router/web/api/MemoryRouter
Est-ce ce que vous voulez? Comme le dit le site officiel: Un
monsieur, je crée un formulaire de publication de poste que vous pouvez voir à cette URL payforworks.com/project/ post-job si vous remplissez ce formulaire et cliquez sur le bouton suivant un composant charge mais l'URL n'a pas changé Je ne comprends pas les didacticiels et la documentation, alors pouvez-vous me donner un extrait de code
Essayez d'utiliser CSS pour contrôler la visibilité du composant. N'utilisez pas de routage.