Блог

Вот мой пример кода…при этом большинство вещей удалены…

 class MyView extends Component {

aFlag = true //initialize class variable here

componentDidMount() {
 // for some reason even after this component unmounts and mounts again this class variable stays at false (a value that we set in this compoment at some point)...
 this.aFlag = true // (1) ***** IF I TAKE THIS OUT...the console log for this.aFlag below is FALSE
 console.log('this', this) // (2) shows a MyView Object, aFlag key has value FALSE!!!
 console.log('this.aFlag:', this.aFlag)// (3) this console log show TRUE

//other code here that uses this.aFlag removed...

}
...

renderItem = () => {
//other code removed...
if (some condition) this.aFlag = false
}

render(){
<Flatlist
renderItem={this.renderItem}
...other code removed
/>
}

  

У меня есть простой класс с переменной класса, инициализированной значением true в определении класса.

Вот что происходит. Создайте экземпляр компонента …componentDidMount регистрирует то, что я показываю выше в комментариях. Почему это так?

Почему журнал консоли this отображается aFlag как false

Что такое консоль.журнал this.aFlag ссылок?

У меня проблема с областью действия?

посмотрите на диаграмму жизненного цикла здесь. кажется renderItem , выполняется раньше componentDidMount()

Ваша проблема в том, что componentDidMount вызывается после render . Если вы установите для него значение false, render тогда оно будет false componentDidMount .

Вы можете использовать constructor вместо этого, если это проблема, как она вызывалась ранее render .

Источник: https://reactjs.org/docs/react-component.html#componentwillmount