VueJS 続行する前に axios データを待つ方法

Question

データを変数に解析してポストリクエストを送信するコードがあります。

問題は、API からプロパティが必要ですが、それが返されるまで待つ方法がわからないことです。

addFieldData(data,generatorData) {
      this.populateModel(データ);

      console.log(this.model);

      this.$axios.post('data/webform/fields', this.model)
        .then(res => {
          console.log(res);

          this.$notify({
            グループ: 「アプリ」、
            タイトル: this.$t("general.success"),
            テキスト: this.$t("general.action_has_been_processed"),
            タイプ: "情報"
          });
        }).catch(error => {
            this.$notify({
                グループ: 「アプリ」、
                タイトル: this.$t("general.error"),
                テキスト: this.$t("general.error_occured"),
                タイプ: "エラー"
            });
          コンソール.ログ(エラー);
      });
    }、
    PopulateModel(データ) {
      this.model.label = data.label ?? {};
      this.model.hint = data.placeholder ?? {};
      this.model.attributes = data.attributes ?? {};
      this.model.maxlength = data.maxlength ?? 0;
      this.model.position = this.getFieldPosition();
      this.model.required = data.required ?? true;
      this.model.visible = data.visible ?? true;
      this.model.disabled = data.disabled ?? false;
      this.model.style_classes = data.style_classes ?? "";
      this.model.model = data.model ?? "";
      this.model.default = data.default ?? "";
      this.model.input_type = data.input_type ?? "";
      this.model.hint = data.hint ?? "";
      this.model.help = data.help ?? "";
      this.model.type = データ.タイプ;
    }、
    async getFieldPosition() {
      const res = await this.$axios.get('/data/webform/' this.idWebform '/itemsCount');
      this.model.position = res.data.data.count 1;
      res.data.data.countを返します。
    },

addFieldData では、populateModel を呼び出します。これは API から位置を取得する必要がありますが、getFieldPosition がデータを返す前に post リクエストを呼び出します。

まず getFieldPosition を待ってから POST リクエストを送信してみます。

Answer 1

まず、.then を含めずに、すべての async/await を用意する必要があります。
この 2 つを混同しないでください。最初のものを使用してください。

次に、 async PopulateModel メソッドに

を含める必要があります。 リーリー

getFieldPosition は非同期であるためです。