Как найти локальное this вместо глобального this?

#firebase #react-native #firebase-realtime-database

#firebase #react-native #firebase-realtime-database

Вопрос:

Я очень новичок в React Native и во всем потоке таких приложений, поэтому извините, если это очевидная вещь. 🙂

Итак, я создал компонент, в котором есть этот код:

 constructor(props) {
  super(props);
  this.state = {isLoading: true}; //this = object
}

componentWillMount() {
  var currentBusiness = firebase.database().ref("business/"   this.props.business)
  currentBusiness.on('value', function(snapshot) {
    currentBusinessData = snapshot.val()
    this.setState = ({isLoading: false}) //this = globalobject
  });
}
  

Затем в моей функции рендеринга я хочу использовать this.state.isLoading для запуска нового представления при загрузке данных, однако проблема заключается в вызываемой функции, когда возвращаются данные, это относится к globalobject, который, как я полагаю, вызван тем, что firebase.database инициируется на глобальном уровне, но как это сделатьЗатем я вызываю setState на уровне локального компонента, чтобы запускался новый рендеринг?

Ответ №1:

Я предпочитаю такой подход

 currentBusiness.on('value', (snapshot) => {
    currentBusinessData = snapshot.val()
    this.setState({isLoading: false}) 
});
  

Функция arrow получает правильное «это» для вас.

В качестве альтернативы, классическая переменная ‘self’ или ‘that’ тоже должна работать.

 const self = this
currentBusiness.on('value', function(snapshot) {
    currentBusinessData = snapshot.val()
    self.setState({isLoading: false}) 
});
  

кстати, this.setState — это функция, и она вызовет повторный рендеринг.

Комментарии:

1. Спасибо за ответ!

2. Извините, это опубликовано при вводе.

3. И снова. Думаю, я должен сделать все это в одной строке. Попробовал self, но это не удалось с переменной unknown. Затем я попробовал синтаксис стрелки, и он работает. За исключением того факта, что он не запускает рендеринг автоматически, но я могу заставить его работать, если я сделаю это.state = {isLoading: false}, а затем использовать this.forceUpdate впоследствии.

4. Хорошо, заставил self работать, поскольку в нем не возвращается ошибка, но рендеринг по-прежнему не запускается автоматически.

5. Ах, у меня было = в this.setState . Думаю, я должен был просто скопировать ваш ответ, а не вводить его сам, тогда я бы сработал как шарм в первый раз — спасибо 🙂