2016-07-07 3 views
-1

ユーザーがメニューをクリックしても私の解決策は機能しません。私を助けてくれますか?Reactjsの親機能を呼び出す(メニュー項目の引き出しを有効にするにはMaterial-uiをクリックしてください)

import React, { Component } from 'react'; 
// Import Appbar 
import AppBar from 'material-ui/AppBar'; 
import Drawer from 'material-ui/Drawer'; 
import LeftMenu from './Left_menu'; 

class Header extends Component { 
    constructor(props) { 
    super(props); 
    this.state = {open: false}; 
    } 
    handleToggle() { 
    this.setState({open: !this.state.open}); 
    } 

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

    render() { 
    return(
     <div> 
     <AppBar 
     title="Log" 
     onLeftIconButtonTouchTap={this.handleToggle.bind(this)} 
     /> 
     <Drawer 
      docked={false} 
      open={this.state.open} 
      onRequestChange={(open) => this.setState({open})} 
     > 
      <LeftMenu handleClose={this.handleClose} /> 
     </Drawer> 
     </div> 
    ); 
    } 
}; 

export default Header; 

子供

import React, { Component } from 'react'; 
import Drawer from 'material-ui/Drawer'; 
import MenuItem from 'material-ui/MenuItem'; 

class LeftMenu extends Component { 
    constructor(props) { 
    super(props); 
    } 
    render() { 
    return (
     <div> 
      <MenuItem onTouchTap={(event) => this.props.handleClose(event)}>Menu Item</MenuItem> 
      <MenuItem onTouchTap={(event) => this.props.handleClose(event)}>Menu Item 2</MenuItem> 
     </div> 
    ); 
    } 
} 

export default LeftMenu; 

私はメッセージが表示されます。例外TypeError:this.setStateは、私は流星が+ + MaterialUI

リアクト使用している機能

ではありません

ありがとう

答えて

1

あなたは、あなたがhandleTogglehandleCloseで行っているだけのように、onRequestChangeのうち、そのロジックを負いませsetStaterenderでなければならない:

<Drawer 
     docked={false} 
     open={this.state.open} 
     onRequestChange={(open) => this.setState({open})} // this.handleRequest?? 
    > 
0

を解決します。子供で

親で

<LeftMenu handleClose={this.handleClose.bind(this)} /> 

<MenuItem onTouchTap={this.props.handleClose}>Menu Item</MenuItem> 
<MenuItem onTouchTap={this.props.handleClose}>Menu Item 2</MenuItem> 

とにかく感謝。

関連する問題