I'm working on a website and I have created a profile page in this profile page there are buttons ( Settings , Favourites , Posts) I made it like a multi-step form , when you click one of those buttons it shows one of 3 pages ( each button has an onClick method that sets the page number and an if functions returns every page according to that number ) the first page that shows when you click on profile is the Settings and I have a button for favourites in the navbar and I want to link it to the profile page in a way that shows the favourites page and not the settings when I click on it. I apologize if my question isn't clear / understandable I'm still new to web development. Here's the code for the page display :
const [page,setPage]=useState(0);
const FormText=["Reglages","Mes Annonces","Favoris"]
const PageDisplay =()=> {
if (page === 0){
return <Reglages/>;
}
else if (page === 1){
return <Mesannces/>;
}
else if (page === 2){
return <Favoris />;
}
this is the code for the buttons :
<Button onClick={()=>{setPage ((currentPage)=>currentPage=0);}} disabled={page===0}>Reglages</Button>
<Button onClick={()=>{setPage ((currentPage)=>currentPage=1);}} disabled={page===1}>Mes Annonces()</Button>
<Button onClick={()=>{setPage ((currentPage)=>currentPage=2);}} disabled={page===2}>Favoris</Button>
const [page, setPage] = useState(0)
//Where your will render, inside your div
<div>
{page === 0 ? < Reglages/> : page === 1 ? < Mesannces/> : page === 2 && < Favoris />
</div>
Buttons
<Button onClick={()=>setPage(0)} disabled={page===0}>Reglages</Button>
<Button onClick={()=>setPage(1)} disabled={page===1}>Mesannces</Button>
<Button onClick={()=>setPage(2)} disabled={page===2}>Favoris</Button>
I hope this helps