React Native и это ключевое слово

118
11

Я интегрирую вход в Facebook в приложение React Native, которое я создаю. У меня есть следующий код:

class FacebookButton extends Component {

constructor(props) {
super(props);
this.fetchAccessToken = this.fetchAccessToken.bind(this);
}

facebookButtonPressed() {
LoginManager.logInWithReadPermissions(['public_profile']).then((result) => {
if (result.isCancelled) {
console.log('Login Cancelled');
} else {
this.fetchAccessToken();
}
})
.catch((error) => {
console.log('Login fail with error: ' + error);
});

}

fetchAccessToken() {
AccessToken.getCurrentAccessToken().then((data) => {
const { accessToken } = data
console.log(accessToken);
})
.catch(() => {
console('Error getting access token');
});
}
render() {
return (
<Button
onPress={this.facebookButtonPressed}
title="Sign In with Facebook"
color="#000000"
/>
);
}

}

Тем не менее, я продолжаю получать ошибку, что метод fetchAccessToken не является функцией. По первому инстинкту я думал, что проблема заключается в this ключевом слове. Поэтому я начал с добавлением вышеуказанной конструкции и связывания this к нему. Я предположил, что this означает FacebookButton. т.е. я предположил, что всякий раз, когда я вызывал this.fetchAccessToken() он вызывал метод. Однако это не сработало.

Затем я продолжил чтение, и было несколько ссылок, в которых говорилось, что я должен использовать Arrow functions поскольку Arrow functions стрелок не имеют this связанного с этой функцией, и это this.fetchAccessToken() будет иметь только один контекст, т.е. FacebookButton. Однако это все еще не работает.

Поэтому у меня есть вопросы:

Каковы точные проблемы, из-за которых вышеуказанный код не работает. Интуиция деталей будет оценена по достоинству. Я беру React Native для вращения в первый раз. Каким будет исправление?

Обновить

Ответ на вопрос 2 заключается в том, чтобы добавить .bind(this) к кнопке:

<Button
onPress={this.facebookButtonPressed.bind(this)}
title="Sign In with Facebook"
color="#000000"
/>

спросил(а) 2021-01-19T15:32:13+03:00 6 месяцев назад
1
Решение
77

Вам также необходимо связать facebookButtonPressed() в конструкторе, чтобы ссылаться на this для fetchAccessToken как

constructor(props) {
super(props);
this.facebookButtonPressed = this.facebookButtonPressed.bind(this)
this.fetchAccessToken = this.fetchAccessToken.bind(this);
}

Когда вызывается функция, запись активации, иначе известный как контекст выполнения, создается. Эта запись содержит информацию о том, откуда была вызвана функция (стек вызовов), как была вызвана функция, какие параметры были переданы и т.д.

Прямо сейчас, на который не ссылаются, если вы не связываете его.

Вот некоторые из различных способов binding. Методы объясняются их плюсами и минусами

Также вы можете узнать больше об this из here

ответил(а) 2021-01-19T15:32:13+03:00 6 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема