Как используя arrow function на onchange не потерять контектст и передать переменую?

Question

[Роман Александрович]

При разработке всплыл интересный вопрос как используя эроу функцию не потерять контекст и передать переменную.

Comments

[alvvi]

Еще один интересный вопрос: зачем использовать arrow function на onchange, если необходимо сохранить контекст?

[Роман Александрович]

Илья Ростопка: наверно за тем что эроу функции автоматом его подтягивают и нет необходимости писать bind

[alvvi]

Роман Александрович: они, как раз, наоборот, ничего лишнего не подтягивают, это обычные функции при создании биндят this к объекту, в котором их объявили. Arrow function же берет контекст из места вызова функции. Вам то что из этого нужно?

[Роман Александрович]

Илья Ростопка: у меня есть input и на нём висит onchange. мне нужно вызвать функцию и не потерять контекст и передать параметр и не использовать bind.

[Роман Александрович]

Илья Ростопка: onChange={()=>this.phone} таким образом я вызываю функцию и контекст сохраняется. если вызвать её с входным параметром то входной параметр прилетает а контекст теряется

[alvvi]

Роман Александрович: https://jsfiddle.net/jwm6k66c/3279/ ничего не теряется

[Роман Александрович]

Илья Ростопка: onChange={(e) => this.handleChange(e)} будьте любезны засуньте сюда еще 1 параметр

[alvvi]

Роман Александрович: а вы сами не можете этого сделать? https://jsfiddle.net/jwm6k66c/3280/

[Роман Александрович]

Илья Ростопка: спасибо

[Sayonji]

Илья Ростопка:

обычные функции при создании биндят this к объекту, в котором их объявили. Arrow function же берет контекст из места вызова функции

Вообще нет. Arrow сразу биндится к тому месту, где объявили. А обычная берет за this объект, который был перед точкой в момент вызова (или window/global если перед точкой ничего не было).