是否可以用菜單選項打開另一個菜單？

Question

目前我可以通過點擊一個菜單觸發器打開一個菜單，並且效果很好。我正在嘗試實現一個過程，以便我可以打開菜單-a，從菜單中選擇一個選項-a，然後使用slide in方法打開菜單-b。這個模塊有可能嗎？

Answer 1

您可以使用菜單controlled component來聲明哪些菜單應該打開並關閉哪個菜單。例如：

export default class ControlledExample extends Component { 
    state = { 
    opened1: false, 
    opened2: false, 
    } 

    render() { 
    return (
     <MenuContext style={{ flexDirection: 'column', padding: 30 }}> 
     <Menu 
      opened={this.state.opened1} 
      onBackdropPress={() => this.setState({ opened1: false })} 
      onSelect={() => 
      this.setState({ 
       opened1: false, 
       opened2: true, 
      })} 
     > 
      <MenuTrigger 
      onPress={() => this.setState({ opened1: true })} 
      text="Select option" 
      /> 
      <MenuOptions> 
      <MenuOption value={1} text="One" /> 
      <MenuOption value={2} text="Two" /> 
      <MenuOption value={3} text="Three" /> 
      </MenuOptions> 
     </Menu> 
     <Menu 
     renderer={SlideInMenu} 
      opened={this.state.opened2} 
      onBackdropPress={() => this.setState({ opened2: false })} 
      onSelect={() => this.setState({ opened2: false })} 
     > 
      <MenuTrigger /> 
      <MenuOptions> 
      <MenuOption value={1} text="One *" /> 
      <MenuOption value={2} text="Two *" /> 
      <MenuOption value={3} text="Three *" /> 
      </MenuOptions> 
     </Menu> 
     </MenuContext> 
    ) 
    } 
}