在 EmberJS 中向外部 API 发出 PUT 请求的推荐方法是什么?
What is the recommended way to make a PUT request to an external API in EmberJS?
我有一个简单的应用程序,它从外部 API 检索记录并显示值 ("day")。可以通过一个简单的操作将日期值传递到组件中来增加日期值。我的应用程序正在正确检索记录并将其成功传递给组件。但是一旦它增加了价值,我就无法找到将记录 save
返回到外部 API.
的最佳方法
我的 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。使用更改后的数据向 API 发出 PUT 请求的最佳方法是什么?
您可能希望将整个模型传递给您的组件。像这样:
<Wait @someBetterName={{@model}} />
(顺便说一句,您可能希望您的模型是事物的哈希值,这样您就可以为事物使用更规范的名称)
async model() {
let myModelA = await this.store...
// ...
return {
modelA: myModelA,
modelB: myModelB,
}
}
但是在 Wait 中,你可以让你的 action 这样做:
actions:{
async incrementDay() {
let day = this.someBetterName.day;
this.someBetterName.set('day', day + 1);
await this.someBetterName.save();
console.log('saved!')
}
}
我有一个简单的应用程序,它从外部 API 检索记录并显示值 ("day")。可以通过一个简单的操作将日期值传递到组件中来增加日期值。我的应用程序正在正确检索记录并将其成功传递给组件。但是一旦它增加了价值,我就无法找到将记录 save
返回到外部 API.
我的 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。使用更改后的数据向 API 发出 PUT 请求的最佳方法是什么?
您可能希望将整个模型传递给您的组件。像这样:
<Wait @someBetterName={{@model}} />
(顺便说一句,您可能希望您的模型是事物的哈希值,这样您就可以为事物使用更规范的名称)
async model() {
let myModelA = await this.store...
// ...
return {
modelA: myModelA,
modelB: myModelB,
}
}
但是在 Wait 中,你可以让你的 action 这样做:
actions:{
async incrementDay() {
let day = this.someBetterName.day;
this.someBetterName.set('day', day + 1);
await this.someBetterName.save();
console.log('saved!')
}
}