爲什麼Material-UI Appbar onLeftIconButtonTouchTap不起作用？

Question

我正在學習React-Redux，Material-UI。
現在，我試圖創建示例應用程序，但不工作。
我不知道如何改進我的代碼。
當Material-UI AppBar onLeftIconButtonTouchTap被點擊時，我想打開Drawer。
我想我無法將我的Action綁定到組件。
當以下代碼正在運行時，不會觸發onLeftIconButtonTouchTap事件。
當我將openDrawer更改爲openDrawer（）時，在Chrome開發工具中發現JS錯誤「openDrawer不是函數」。

Header.jsx爲Component

import React, { PropTypes } from 'react'; 
import AppBar from 'material-ui/AppBar'; 
import Drawer from 'material-ui/Drawer'; 

const Header = ({ 
    openDrawer, 
    open 
}) => (
    <div> 
    <AppBar 
     title='sample' 
     onLeftIconButtonTouchTap = {() => openDrawer} 
    /> 
    <Drawer 
     docked={false} 
     open={open} 
    /> 
    </div> 
) 

Header.PropTypes = { 
    openDrawer: PropTypes.func.isRequired, 
    open: PropTypes.bool.isRequired 
} 

export default Header; 

HeaderContainer.jsx作爲容器

import React from 'react'; 
import { bindActionCreators } from 'redux' 
import { connect } from 'react-redux'; 

import { header } from '../actions' 
import Header from '../components/Header'; 

const mapStateToProps = (state) => ({open}); 
const mapDispatchToProps = (dispatch) => (
    {openDrawer: bindActionCreators(header, dispatch)} 
); 

const HeaderContainer = connect(
    mapStateToProps, 
    mapDispatchToProps 
)(Header); 

export default HeaderContainer; 

App.jsx作爲RootComponent

import React, { Component, PropTypes } from 'react'; 

import Header from '../components/Header'; 

import injectTapEventPlugin from "react-tap-event-plugin"; 

import baseTheme from 'material-ui/styles/baseThemes/lightBaseTheme'; 
import getMuiTheme from 'material-ui/styles/getMuiTheme'; 

injectTapEventPlugin(); 

class App extends Component { 
    constructor(props) { 
    super(props); 
    } 

getChildContext() { 
     return { muiTheme: getMuiTheme(baseTheme) }; 
    } 

    render() { 
    return (
     <div> 
     <Header /> 
     {this.props.children} 
     </div> 
    ); 
    } 
}; 

App.childContextTypes = { 
    muiTheme: React.PropTypes.object.isRequired, 
}; 

export default App; 

預先感謝。

Answer 1

您沒有正確綁定該功能。你需要更新你的代碼

<AppBar 
    title='sample' 
    onLeftIconButtonTouchTap = { openDrawer.bind(this) } 
/> 

更多.bind()方法在這裏：Use of the JavaScript 'bind' method