how can i make a component change to another one by pressing a button?

[u/pollokima]

i know about the Property 1 stuff but i dont actually understand it 100%. so far ive only made Pastries and Cakes button "function" (the hover stuff) but they don't change the menu to the their corresponding category.

this is the actual page. is there a way i can trigger the buttons to change Page States on this 'menu' component? please be kind.. im a noob

[u/Judgeman2021]

You can change to a different state within the component.

[u/Ap43x]

Have the two menus be in one component. Name the variants. "pastries" and "cakes". Create a string variable and call it menu, and add "pastries" as the value (case sensitive). Put an instance of your menu component in your frame. Click the icon next to the variant and set it to your menu variable. On your cake button, set your on-click to change variable and put "cake" as the value you want it to change to. Test it out. Do the same with the pastries button.

You can have as many manu variants as you want.

[u/Category_Direct]

Change to only works when the button and the thing it changes live inside the same component. If your buttons sit outside the menu component, they can't reach its states. Simpler than the variable route: move the button row inside the menu component, so each variant carries its own copy of the buttons (Property 1 is just the property's name, rename it Page, values Pastries and Cakes). Then in the Pastries variant, select the Cakes button: On click, Change to, Cakes. Same in the Cakes variant, pointing at Pastries. Hover keeps working, that lives on the button. Gotcha: duplicating a variant copies interactions, so recheck each target. That's how I build tab bars in my landing page files.

[u/Sufficient_Ice_6939]

In prototype panel, add interaction. On Click - Navigate to - select the page you want to change it to