Каков рекомендуемый способ сделать запрос PUT к внешнему API в EmberJS? - PullRequest
Новая
       13

Каков рекомендуемый способ сделать запрос PUT к внешнему API в EmberJS?

0 голосов
/ 15 апреля 2019

У меня есть простое приложение, которое извлекает запись из внешнего API и отображает значение («день»).Значение дня можно увеличить, передав его в компонент простым действием.Мое приложение правильно извлекает запись и успешно передает ее компоненту.Но как только он увеличил значение, я не могу найти лучший способ save записи обратно во внешний API.

My route выбирает объект следующим образом: 

export default Route.extend({
  model() {
    return this.get('store').findRecord('world', '5cb0f8bd3b74cf22b75e1a37', { reload: true });
  },
})

Это мой model: 

import Model from 'ember-data/model';
import DS from 'ember-data';

const { attr } = DS;

export default Model.extend({
  day: attr('Number'),
});

В моем шаблоне значение дня отображается в моем компоненте с помощью: 

<Wait @day={{model.day}}></Wait>

И у моего компонента есть кнопка, которая вызываетВот как: 

<button {{action "incrementDay"}} class="btn btn-default" aria-hidden="true">Wait</button>

Наконец, вот мой component: 

import Component from '@ember/component';
import { inject as service } from '@ember/service';

export default Component.extend({
  router: service(),
  store: Ember.inject.service(),
  actions: {
    incrementDay() {
      this.day++;
      console.log(this.day);
    }
  }
});

Каждый раз, когда я нажимаю кнопку, консоль успешно выводит увеличенное число, но я неуверен, как сохранить изменения обратно в API.Каков наилучший способ сделать запрос PUT обратно в API с измененными данными?

1 Ответ

2 голосов
/ 15 апреля 2019

Возможно, вы захотите передать всю модель вашему компоненту.как это: 

<Wait @someBetterName={{@model}} />

(кроме того, вы можете захотеть, чтобы ваша модель была хешем вещей, чтобы вы могли использовать больше канонических имен для вещей) 

async model() {
  let myModelA = await this.store...
  // ...
  return {
    modelA: myModelA,
    modelB: myModelB,

  }
}

но затемподождите, вы могли бы сделать ваши действия сделать это: 

  actions:{
    async incrementDay() {
      let day = this.someBetterName.day;
      this.someBetterName.set('day', day + 1);

      await this.someBetterName.save();
      console.log('saved!')
    }
  }
...