Могу ли я получить данные из базы данных, которая выполняет вызов API, а затем передать их другой функции, которая выполняет другой вызов API

Question

В ответ я хочу получить данные из базы данных. Я попытался получить данные из базы данных с помощью getCoor () и поместить в метод конструктора. Я определил переменные приватные данные: any = []; и определил состояние this.state = {data: []}

Здесь я пытаюсь

• Получить данные из базы данных с помощью вызовов API
• передать это данные с помощью другого вызова API.

Проблема: данные из getCoor не хранятся в моих переменных.

  componentDidMount() {
    this.defaultCoor();
    const Markers = async () => {
      await this.getCoor(); // this.data=json;
      await this.addGoogleMapScript();//do something with this.data 

    }
    Markers();
}

Файл this.data пуст. Я пытаюсь дождаться, пока getCoor завершит вызов API, получит данные и передаст addGoogleMapscript, возможно ли это в React?

Решение

private getCoor() {
    const qurl = `/_api/web/lists/getbytitle('${this.props.list}')/items?$select=*&$orderby=Created asc`;

    const opt: ISPHttpClientOptions = {
      headers: { "Content-Type": "application/json;odata=verbose" }
    };

    return this.props.spHttpClient
      .get(
        this.props.context.pageContext.web.absoluteUrl + qurl,
        SPHttpClient.configurations.v1,
        opt
      )
      .then((response: SPHttpClientResponse) => {
        return response.json().then((json: any) => {
          this.setState({ data: json.value });
          return (this.data = json); 
        });
      });
  }

this.data: any = []; был определен после метода конструкторов в основанном на классе компоненте React. Добавьте , верните в функции API и верните this.data:)

Answer 1

Вы получаете данные, но не присваиваете их переменной. Чтобы это работало, ваша Markers функция должна выглядеть примерно так:

componentDidMount() {
  this.defaultCoor();
  const Markers = async () => {
    const data = await this.getCoor();  // this.data=json;
    await this.addGoogleMapScript(data);  //do something with this.data 
  }
  Markers();
}