表单submit ember.js上的POST请求

Question

我在Ember.JS中完全是绿色的。我用Ember教程制作了一个简单的收养庇护所应用程序，因为我在前端使用Ember，而Strapi(Node.JS(作为无头CMS。我有所有的端点，我的ember前端通过JavaScript的fetch使用GET方法成功地获取数据。然而，我想允许用户基于表单提交创建POST请求，我找不到任何好的例子或教程来正确地在ember.js中的表单提交上进行POST请求，你能帮我弄清楚如何做到这一点吗？

Answer 1

使用：

• https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
• https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
• https://developer.mozilla.org/en-US/docs/Web/API/FormData
• https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/formdata_event
• https://developer.mozilla.org/en-US/docs/Web/API/SubmitEvent
• https://guides.emberjs.com/release/components/template-lifecycle-dom-and-modifiers/#toc_event-处理程序

我想你可以通过提交表格

ember g component my-form -gc

然后在组件中

// app/components/my-form.js
import Component from '@glimmer/component';
export default class MyForm extends Component {
submit = async (event) => {
event.preventDefault();
let data = new FormData(event.target);
await fetch('your url', {
method: 'POST',
body: JSON.stringify(data),
});
}
}

{{! app/components/my-form.hbs }}
<form {{on 'click' this.submit}}>
...
</form>