Как получить это прототип функции в React.component

Question

Для примера, мне нужно получить объект Component на 'это', но 'это' не определено

компонент:

<Menu onClick ={()=>this.MenuNavigate()}/> 

protoTypeFunction:

React.Component.prototype.MenuNavigate = (e) => { 
    // let url = e.item.props["data-url"] 
    console.log(this)->undefined 
} 

Как получить «это»?

я думаю, что все компоненты распространяется React.Component, поэтому я хочу использовать функцию во всех компонентах, что простирается React.Component, для я не нужно wirte еще раз

Answer 1

Если вы пытаетесь продлить React.Component, я не был бы совет по баловаться с классом React.Component, я хотел бы создать свой собственный базовый класс, как это:

class BaseComponent extends React.Component { 
    constructor(props) { 
    super(props); 
    this.MenuNavigate = this.MenuNavigate.bind(this); 
    } 

    MenuNavigate(e) { 
    console.log(this); 
    } 
} 

И затем использовать его как это:

class Demo extends BaseComponent { 
    render() { 
    return <Menu onClick={this.MenuNavigate} />; 
    } 
} 

Answer 2

this не определено, потому что вы использовали функцию стрелки, которая имеет лексически ограниченную область this, т. Е. Она привязана к контексту, в котором она была определена, а не к объекту, на который он вызывается.

Используя выражение функции решает вопрос:

React.Component.prototype.MenuNavigate = function(e){ 
    console.log(this); 
} 

https://jsfiddle.net/69z2wepo/70670/

Но я бы не пойти по этому пути. То, что @Canastro предлагает в другом ответе, является хорошим подходом, другим способом может быть компонент более высокого порядка, который может обертывать ваши компоненты и обеспечивать функциональность MenuNavigat.