ошибка компонента реагирования Невозможно прочитать свойство undefined

Я новичок в React, я создал такой компонент;

export default class CartoviewDrawer extends React.Component {

    constructor(props) {
        super(props);
        this.state = {open: false};
    }

    _handleToggle() {
        let open = this.state.open;
        this.setState({open: !open})
    }

    render() {
        return (
            <div>
                {/*<RaisedButton*/}
                {/*label="Toggle Drawer"*/}
                {/*onTouchTap={this.handleToggle}*/}
                {/*/>*/}
                <IconButton tooltip="Toggle Drawer"
                            onTouchTap={this._handleToggle}
                >
                    <i className="material-icons">list</i>
                </IconButton>
                <IconButton iconClassName="muidocs-icon-custom-github"/>
                <Drawer open={this.state.open}>
                    <MenuItem>Menu Item</MenuItem>
                    <MenuItem>Menu Item 2</MenuItem>
                </Drawer>
            </div>
        );
    }
}

и в другом файле я импортирую этот компонент с помощью;

import CartoviewDrawer from './cartoview_drawer'

то я использую этот компонент:

React.createElement(AppBar,toolbarOptions,React.createElement(CartoviewDrawer))

но когда я нажимаю на значок, ошибка в консоли браузера и ящик не появляются. ошибка:

Uncaught TypeError: невозможно прочитать свойство open of undefined


reactjs material-ui jsx
person Community    schedule 28.12.2016    source источник
comment
установите this для _handleToggle, this._handleToggle.bind(this) или используйте функцию стрелки () => this._handleToggle()   -  person Oleksandr T.    schedule 28.12.2016
comment
@AlexanderT. Большое спасибо, теперь все отлично работает   -  person    schedule 28.12.2016

Ответы (2)


arrow_upward
1
arrow_downward

Вам не хватает привязки к this, измените вызов onTouchTap на это:

onTouchTap={this._handleToggle.bind(this)}
person Kinnza    schedule 28.12.2016

arrow_upward
2
arrow_downward

Добавьте привязку в конструктор компонента:

constructor(props) {
  super(props);
  ...
  this._handleToggle= this._handleToggle.bind(this);
}
person Facundo La Rocca    schedule 28.12.2016