Ember Super Rentals 教程 3.15 - 使用数据

Question

我正在学习 ember Super Rental 3.15 教程，当我到达使用数据部分时，我用模型挂钩更新了路由索引文件，页面停止工作。我还发现 ember 教程不完整。

错误说地图的属性未定义路线 index.js 文件中的代码：

import Route from '@ember/routing/route';

const COMMUNITY_CATEGORIES = [
  'Condo',
  'Townhouse',
  'Apartment'
];

export default class IndexRoute extends Route {
  async model() {
    let response = await fetch('/api/rentals.json');
    let { data } = await response.json();

    return data.map(model => {
      let { attributes } = model;
      let type;

      if (COMMUNITY_CATEGORIES.includes(attributes.category)) {
        type = 'Community';
      } else {
        type = 'Standalone';
      }

      return { type, ...attributes };
    });
  }
}

图片如果错误信息：

Answer 1

您的问题是 fetch('/api/rentals.json'); 没有 return 正确的数据。所以当你做 let { data } = await response.json(); 那么 data 将是 undefined 而你不能做 undefined.map.

所以您发布的代码是正确的。问题出在别处。您可以查看：

您是否正确添加了 rentals.json 文件？如果你打开 http://localhost:4200/api/rentals.json 你能看到数据吗？那你做完了吗this?
我从 mirage 看到一些错误。 super-rentals 教程不使用mirage。我可以看到这个 here（旁注：git 回购是根据指南自动 创建的 ，因此它始终是最新的）。所以这可能是你的问题。根据如何你配置海市蜃楼它基本上会模拟所有你的ajax请求。这意味着 fetch(... 将不再像预期的那样工作，mirage 假设您总是想使用模拟数据并且您没有正确配置 mirage。您可以尝试从 package.json 中删除 mirage，重新运行 npm install，重新启动 ember server 并重试。

Ember Super Rentals 教程 3.15 - 使用数据

Ember Super Rentals Tutorial 3.15 - Working with data

ember.js

ember-data

ember-router