Почему не работает asyn/await при создании класс?

Question

Пытаюсь создать класс и проинициализоровать его состояние с помощью async метода. Но если обратиться к состоянию класса из другого объекта, то получаю мусор.

File1.js:

 async function getData() {
  var dtemp = {};

  try {
    var response = await fetch(url);
    var json = await response.json();
    dtemp = {json: json};
  } catch (error) {
    alert('Error in getData() : ' + error);
  }
  return dtemp;
}
export default class GetApi {
  data = {};
  constructor(ar) {
    this.data = ar;
  }

  static async build() {
    var result = await getData();
    return new GetApi(result);
  }
}

Создаю объект таким образом и отправляю в качестве параметра в другой класс.

file2.js:

<Stack.Screen
          name="HomeScreen"
          component={HomeScreen}
          initialParams={{
            api: GetApi.build(),
          }}

        />

В другом классе

 this.props.route.params.api.data

выдает объект который не содержит, то что должно.

Как правильно создавать объект асинхронно?

Answer 1

Дождитесь разрешения промиса в componentDidMount и перерисуйте дочернее древо

const loadData = () => new Promise((res) => setTimeout(() => res('omg'), 5000));

const {
    useState,
    useEffect
} = React;

const App = () => {

    const [response, setResponse] = useState(null);

    useEffect(() => {
        loadData().then((msg) => setResponse(msg));
    }, []);

    if (response === null) {
        return (<p>loading</p>);
    } else {
        return (<p>{response}</p>);
    }
}

ReactDOM.render(<App/>, document.querySelector("#app"));

БЛОГ НА HUSL

Почему не работает asyn/await при создании класс?

Ответы (1 шт):