You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
importReact,{useState}from'react';import{View}from'react-native';import{Button,Menu,PaperProvider}from'react-native-paper';constMyComponent=()=>{const[randomVarialbeToForceRerender,setRandomVarialbeToForceRerender]=useState(0);const[visible,setVisible]=useState(false);constopenMenu=()=>{console.debug('Opening menu');setVisible(true);/** * We update a state variable to force a re-render of the component. * A real-world example could be a network request or some other * asynchronous operation that updates the state. */setTimeout(()=>setRandomVarialbeToForceRerender(Math.random()),1000);};constcloseMenu=()=>{setVisible(false);console.debug('Closing menu');};console.debug('visible',visible);return(<PaperProvider><Viewstyle={{paddingTop: 50,flexDirection: 'row',justifyContent: 'center',}}><Menuvisible={visible}onDismiss={closeMenu}anchor={<ButtononPress={openMenu}>Show menu</Button>}><Menu.ItemonPress={()=>{}}title={`Random ${randomVarialbeToForceRerender}`}/></Menu></View></PaperProvider>);};exportdefaultMyComponent;
Current behaviour
Expected behaviour
How to reproduce?
Preview
Simulator.Screen.Recording.-.iPhone.16.-.2025-06-23.at.12.55.03.mp4
What have you tried so far?
Memoization to avoid re-rendering the menu. However, this approach is limited and breaks
when the menu items are non-static (c.f. example)
Your Environment