Понимание того, как ссылаться на свойства в реакции компонентов

Question

я не могу получить этот основной компонент признать this объект, что бы я ни стараюсь, я получаю ошибку:

Uncaught TypeError: Cannot read property 'getEvents' of undefined

Это код им пытаются получить работу:

import React from 'react' 
import PureRenderMixin from 'react-addons-pure-render-mixin'; 
import { connect } from 'react-redux'; 
import ListGroup from 'react-bootstrap/lib/ListGroup'; 
import ListGroupItem from 'react-bootstrap/lib/ListGroupItem'; 

export const Selector1 = React.createClass({ 
    mixins: [PureRenderMixin], 

    getEvents:() => this.props.eventTypes || [{name: "NO EVENTS!"}], 

    render: _ => 
     <ListGroup> 
     {this.getEvents().map(event => 
      <ListGroupItem>{event.name}</ListGroupItem> 
     )} 
     </ListGroup> 
}); 

function mapStateToProps(state) { 
    return { 
    eventTypes: state.get('eventTypes') 
    }; 
} 

export const Selector1Container = connect(mapStateToProps)(Selector1); 

Почему this неопределенный во время выполнения и что мне нужно сделать, чтобы это на самом деле относятся к тому, что я хочу?

Answer 1

Изменение arrow function (=>) к нормальной функции, потому что стрелка функция не имеет собственного this

export const Selector1 = React.createClass({ 
    mixins: [PureRenderMixin], 

    getEvents() { 
    return this.props.eventTypes || [{name: "NO EVENTS!"}] 
    }, 

    render() { 
    return <ListGroup> 
     {this.getEvents().map(event => 
     <ListGroupItem>{event.name}</ListGroupItem> 
     )} 
    </ListGroup> 
    } 
});