javascript - Ember:没有找到“用户”的模型,并且在执行保存承诺时创建了重复的 POST
问题描述
更新:
任何人都可以帮忙吗?在本周的大部分时间里,我一直在追求这个,但没有运气。我确实注意到客户端正在生成两个 POST。我为适配器添加了代码。还有其他地方我应该看吗?
我正在浏览下面提供的视频教程,当我单击提交按钮将数据保存到数据库时,我无法解决两个错误。
- 未找到“用户”的型号
- 正在生成两个 POST。这会导致 Assertion Failed 错误,我怀疑这是因为从服务器返回的 ID 与前端的当前 ID 不匹配。
我看到数据库有两条新记录。当我再次单击提交按钮时,应用程序会将我带回到显示两条记录的待办事项页面。谁能告诉我我做错了什么?
当前版本:
- 余烬:3.2.2
- 灰烬数据:3.2.0
- jQuery : 3.3.1
- Ember 简单身份验证:1.7.0
视频教程(错误出现在 11:30 标记处):https ://www.youtube.com/watch?v=bZ1D_aYGJnU 。注意:视频的作者似乎已经让重复的 POST 问题在视频结束时消失了,但我不知道如何。
组件/表单/todo-item-form/component.js
import Component from '@ember/component';
export default Component.extend({
actions:{
save(){
this.get('submit')();
}
}
});
组件/forms/todo-item-form/template.hbs
<form {{action "save" on="submit"}}>
{{input placeholder="description" value=todoItem.description}}
<br />
{{#if todoItem.validations.isValid}}
<button type="submit">Add</button>
{{else}}
<button type="submit" disabled>Add</button>
{{/if}}
</form>
模板/s/todo-items/add.hbs
{{forms/todo-item-form
todoItem=model
submit=(route-action "submitAction")
}}
{{outlet}}
模型/todo-item.js
import DS from 'ember-data';
import { validator, buildValidations } from 'ember-cp-validations';
const { attr, belongsTo } = DS;
const Validations = buildValidations({
description: [
validator('presence', true),
validator('length', {
min: 4
})
]
});
export default DS.Model.extend(Validations, {
description: attr('string'),
owner: belongsTo('person')
});
适配器/Application.js
import DS from 'ember-data';
import ENV from 'todo-list-client/config/environment';
const {computed, inject :{service} } = Ember;
export default DS.JSONAPIAdapter.extend({
session: service(),
namespace: ENV.APP.namespace,
host: ENV.APP.host,
headers: computed('session.data.authenticated.token', function() {
let token = this.get('session.data.authenticated.access_token');
return { Authorization: `Bearer ${token}` };
}),
})
路线/s/todo-items/add.js
import Route from '@ember/routing/route';
export default Route.extend({
model(){
return this.store.createRecord('todo-item');
},
actions: {
submitAction() {
this.get('controller.model')
.save()
.then(() => {
this.transitionTo('s.todo-items');
});
}
},
});
解决方案
作者在大约 15m5s 的路由中添加了Ember-Data-Routeadd.js
作为 mixin。这会在模型之后进行清理。
他从那时开始解释,并在接下来的一两分钟内将其添加到视频中:
https://youtu.be/bZ1D_aYGJnU?t=15m5s
import Ember from 'ember';
import DataRoute from 'ember-data-route';
export default Ember.Route.extend(DataRoute, {
model() {
return this.store.createRecord('todo-item');
},
actions: {
save() {
this.get('controller.model')
.save()
.then(() => {
this.transitionTo('s.todo-items');
});
}
},
});
推荐阅读
- firebase-realtime-database - ESP8266 无法从 Google Firebase 读取数据
- python - Python 列表乘法
- python - 反向链表 - 如何删除(输出)末尾的“无”
- c# - 自定义 Xamarin.Forms.Datepicker 以选择和可视化多个日期
- java - 在 JavaFX 中格式化动态添加的标签
- python - Python_Cookbook_3rd_Edition 6.12 一个问题
- java - 当我需要使用两列时如何使用@oneToMany
- r - 对多列进行多次更改的 R 函数
- python - 神经网络 - 以向量为中心的 Python 实现
- python - 喜欢评论时如何增加整数字段