возврат не работает в асин c функция ожидания в реаги js

Question

Я хочу получить результат от другой функции, для этого я использовал asyn c await, функцию, но она не вернула данные, здесь я загрузил код, может кто-нибудь проверить мой код и помочь решить эту проблему проблема, я вызвал эту функцию data_json = await this.get_json_data(url_string);, но я не получаю никаких данных от нее

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isLoaded: false
    };
  }

  async get_json_data(url_string) {
    await fetch("https://cors-anywhere.herokuapp.com/" + url_string)
      .then(res => res.text())
      .then(
        result => {
          let final_data = JSON.parse(result);
          return final_data;
        },
        error => {}
      );
  }

  async componentDidMount() {
    let data_json = "";
    let url_string = location.search.split("url=")[1];
    if (typeof url_string != "undefined" && url_string != undefined) {
      data_json = await this.get_json_data(url_string);
      //console.log("get result")
      //console.log(data_json)
    } else {
      data_json = require("./data.json");
    }
  }
}

Answer 1

Причина, по которой ваша переменная data_json пуста, возможно потому, что вы ничего не возвращаете из своей функции get_json_data. Добавьте возврат к вашему заявлению await fetch.

// Add the return here:
return await fetch("https://cors-anywhere.herokuapp.com/" + url_string)
  .then(res => res.text())
  .then(
    result => {
      let final_data = JSON.parse(result);
      return final_data;
    },
    error => {}
  );

Answer 2

Это потому, что вы находитесь в .then() обратном вызове метода, оператор return будет работать только для следующих .then(). Чтобы проиллюстрировать это, я создаю fiddle

Если вы хотите, чтобы ваша функция возвращала ваши извлеченные данные, вы можете попробовать реализовать тот же лог c, но используя только async await.

async get_json_data(url_string) {
    const res = await fetch("https://cors-anywhere.herokuapp.com/" + url_string)
    const final_data = await res.json()
    return final_data
}

Или, если вы хотите сохранить структуру .then(), вам нужно создать собственную Promise

get_json_data(url_string) {
    return new Promise(resolve => {
      fetch("https://cors-anywhere.herokuapp.com/" + url_string)
      .then(res => res.text())
      .then(
        (result) => {
          let final_data = JSON.parse(result);
          resolve(final_data);
        },
        (error) => {
        }
      )
    })
}