Материал-меню u не закрывается при открытии диалога

Question

Я использую реакцию + материал-ui. я создал dialog компонент в JSX файл, как это:

export default class CartoviewAbout extends React.Component { 
     constructor(props) { 
      super(props); 
      this.state = {open: false}; 
     } 

     _handleOpen() { 
      this.setState({open: true}); 
     }; 

     _handleClose() { 
      this.setState({open: false}); 
     }; 

     render() { 
      const actions = [ 
       <FlatButton 
        label="Close" 
        primary={true} 
        keyboardFocused={true} 
        onTouchTap={this._handleClose.bind(this)} 
       />, 
      ]; 

      return (
       <div> 
        <MenuItem 
         onTouchTap={this._handleOpen.bind(this)} 
         primaryText="Show About Dialog" 
        /> 
        <Dialog 
         title={title} 
         actions={actions} 
         modal={false} 
         open={this.state.open} 
         onRequestClose={this._handleClose.bind(this)} 
         autoScrollBodyContent={true} 
         contentClassName="dialog" 
         bodyClassName="dialog_body" 
        > 
         <div ><p>{abstract}</p> 
         </div> 
        </Dialog> 
       </div> 
      ); 
     } 
    } 

и я использовать этот компонент в меню в другом файле, но затем я нажимаю диалог пункт меню открытым и меню не закрываются:

export default class CartoviewAppBar extends React.Component { 
    constructor(props) { 
     super(props); 
    } 
    render() { 
    const about = appConfig.showAbout ? React.createElement(CartoviewAbout) : ""; 
    const icon_menu = <IconMenu 
      iconButtonElement={<IconButton><MoreVertIcon /></IconButton>} 
      anchorOrigin={{horizontal: 'right', vertical: 'top'}} 
      targetOrigin={{horizontal: 'right', vertical: 'top'}} 
     > 
      {about} 
     </IconMenu>; 
     return (
      <div> 
       <AppBar 
        title={''} 
        showMenuIconButton={false} 
        iconElementRight={icon_menu} 
       /> 
      </div> 
     ); 
    } 

изображение : Я хочу, чтобы меню закрывалось при открытии диалога

Answer 1

Попробуйте это может быть обходным путем.

_handleOpen() { 
    window.setTimeout(() => { 
     this.setState({open: true}); 
    }, 100); //any arbitary timeout 
}; 

MenuItemonClick автоматически вызовет для закрытия IconMenu

Я думаю, что открытие Dialog подавляя событие для закрытия IconMenu. Таким образом, открытие Dialog после закрытия IconMenu с использованием setTimeout

Answer 2

Вам нужно будет добавить компонент Dialog вне IconMenu. Событие onRequestChange от IconMenu не запускается, пока диалог не закрывается.