Ember.js - 使用 ember-cli-mirage 作为假模型时未找到待办事项模型
Ember.js - Model todo not found when using ember-cli-mirage for a fake model
我正在学习 ember.js tutorial
当使用 ember-cli-mirage 为这样的待办事项创建假模型时
import Mirage, {faker} from 'ember-cli-mirage';
export default Mirage.Factory.extend({
title(i) { return 'Todo title ${i + 1}'; },
complete: faker.list.random(true, false)
});
我的 Mirage 配置如下所示
export default function() {
this.get('/todos', function(db, request) {
return {
data: db.todos.map(attrs => (
{type: 'todos', id: attrs.id, attributes: attrs }
))
};
});
this.post('/todos', function(db, request) {
let attrs = JSON.parse(request.requestBody);
let todo = db.todos.insert(attrs);
return {
data: {
type: 'todos',
id: todo.id,
attributs: todo
}
};
});
this.patch('/todos/:id', function(db, request) {
let attrs = JSON.parse(request.requestBody);
let todo = db.todos.update(attrs.data.id, attrs.data.attributes);
return {
data: {
type: "todos",
id: todo.id,
attributes: todo
}
};
});
this.del('/todos/:id');
}
我的困惑主要在于模型。模型的名称是 'todos' 并且 ember 在处理单个记录时以某种方式将其更改为 'todo'。
从我的todos路线,我return模型如下
routes/todos.js
model() {
return this.store.findAll('todos');
}
然后我不明白上面的代码 - 教程说它应该是 this.store.findAll(**'todo'**);
但是 return 没有任何数据到 ember 控制台。我将其更改为 'todos' 并且我看到了一些输出。 (最后输出)
在routes/todos/index.js -- 我们return modelFor('todos')
model(){
return this.modelFor('todos');
}
并且在模板中——todos/index.hbs
<ul id="todo-list">
{{#each model as |todo| }}
{{todo-item todo=todo}}
{{/each}}
</ul>
我知道 index 从 todos.hbs 的 {{outlet}} 得到这个模型
todos.hbs 如下所示
<input type="text" id="new-todo" placeholder="What needs to be done?" />
{{#todo-list todos=model}}
{{outlet}}
{{/todo-list}}
当我运行这个应用程序时,我得到以下错误。
在输出中,我从 / 上的 get 请求中获取数据 --> 这是 todos 路由
但是我无法访问 todos/index 路线中的待办事项。
感谢您的帮助。所有代码片段均来自教程。
检查以下(我注意到的事情):
- 您的模型文件名为 "todo.js" 吗?应该是单数...
- 你的路线应该是单数的
findAll('todo')
!
- 您在 Mirage 配置中的 post 路由有错别字:"attributs: todo" 应该是属性。
- 您正在返回 JSONAPI 格式的数据。您的应用程序适配器使用的是 JSONAPIAdapter 而不是 RestAdapter 吗?
我正在学习 ember.js tutorial 当使用 ember-cli-mirage 为这样的待办事项创建假模型时
import Mirage, {faker} from 'ember-cli-mirage';
export default Mirage.Factory.extend({
title(i) { return 'Todo title ${i + 1}'; },
complete: faker.list.random(true, false)
});
我的 Mirage 配置如下所示
export default function() {
this.get('/todos', function(db, request) {
return {
data: db.todos.map(attrs => (
{type: 'todos', id: attrs.id, attributes: attrs }
))
};
});
this.post('/todos', function(db, request) {
let attrs = JSON.parse(request.requestBody);
let todo = db.todos.insert(attrs);
return {
data: {
type: 'todos',
id: todo.id,
attributs: todo
}
};
});
this.patch('/todos/:id', function(db, request) {
let attrs = JSON.parse(request.requestBody);
let todo = db.todos.update(attrs.data.id, attrs.data.attributes);
return {
data: {
type: "todos",
id: todo.id,
attributes: todo
}
};
});
this.del('/todos/:id');
}
我的困惑主要在于模型。模型的名称是 'todos' 并且 ember 在处理单个记录时以某种方式将其更改为 'todo'。
从我的todos路线,我return模型如下
routes/todos.js
model() {
return this.store.findAll('todos');
}
然后我不明白上面的代码 - 教程说它应该是 this.store.findAll(**'todo'**);
但是 return 没有任何数据到 ember 控制台。我将其更改为 'todos' 并且我看到了一些输出。 (最后输出)
在routes/todos/index.js -- 我们return modelFor('todos')
model(){
return this.modelFor('todos');
}
并且在模板中——todos/index.hbs
<ul id="todo-list">
{{#each model as |todo| }}
{{todo-item todo=todo}}
{{/each}}
</ul>
我知道 index 从 todos.hbs 的 {{outlet}} 得到这个模型 todos.hbs 如下所示
<input type="text" id="new-todo" placeholder="What needs to be done?" />
{{#todo-list todos=model}}
{{outlet}}
{{/todo-list}}
当我运行这个应用程序时,我得到以下错误。
在输出中,我从 / 上的 get 请求中获取数据 --> 这是 todos 路由 但是我无法访问 todos/index 路线中的待办事项。
感谢您的帮助。所有代码片段均来自教程。
检查以下(我注意到的事情):
- 您的模型文件名为 "todo.js" 吗?应该是单数...
- 你的路线应该是单数的
findAll('todo')
! - 您在 Mirage 配置中的 post 路由有错别字:"attributs: todo" 应该是属性。
- 您正在返回 JSONAPI 格式的数据。您的应用程序适配器使用的是 JSONAPIAdapter 而不是 RestAdapter 吗?