Как componentDidMount может ожидать значение из хранилища приставок перед выполнением (без использования setTimeout)?

Question

Я пытаюсь получить информацию об аутентификации в компонент React и получить данные, относящиеся к аутентифицированному пользователю, но componentDidMount не получает значение auth из хранилища приставки, если не используется setTimeOut. Как мне это сделать?

Я пробовал componentWillReceiveProps (), но это тоже не работает.

class Dashboard extends Component {
   componentDidMount = () => {
         console.log(this.props.auth);
       setTimeout(
          () => console.log(this.props.auth),
          100
       )
   }

Только console.log в setTimeout возвращает значение

Answer 1

У меня была такая же проблема некоторое время назад, и что помогло мне подумать о моем компоненте как о функции.

Что я хотел бы сделать, это отобразить счетчик, пока auth не станет нулевым, а затем отобразить другойпросмотреть, как только он будет готов.

    class Dashboard extends Component {    
       render = () => {
             if(this.props.auth === null){
                 return <SpinnerComponent />
             }

             return ....
       }
    }

То, что произойдет, это:

• До того, как props.auth будет готов, компонент будет отображать счетчик
• Послеprops.auth готов, компонент отобразит ваше обычное приложение
• Повторная визуализация происходит при смене реквизита (т. е. изменяется приставка)