Ember 从 store/mirage 获取过滤后的数据

Question

我正在尝试使用 ember 为智能家居设备构建应用程序。我已经安装了 mirage 并声明了一个名为 data 的数组。它包含家庭、用户和设备等数组。现在我坚持从商店获取过滤数据，我真的对商店的行为感到困惑。出于这个原因，我已经阅读了一些类似的主题但这对我来说不起作用。

其实这是我的 router.js

Router.map(function() {
  this.route('about');
  this.route('users', function() {
  });
  this.route('households', function() {
    this.route('index', { path: '/:user_id' })
    this.route('rooms',{ path: '/:household_id' });
    this.route('devices');
  });
});

如果我要 households.index 我想查看在他的 member 数组中有用户 ID 的所有家庭。以下代码片段显示了我的数据结构的示例。

  "users": [
      {
          "id":101,
          "forename":"Peter",
          "surname":"Peterson",
          "memberIn":[
              501
          ]
      },
      {
          "id":102,
          "forename":"Anna",
          "surname":"Peterson",
          "memberIn":[
              501
          ]
      }
]

  "households":[
      {
          "id":501,
          "name":"Zuhause",
          "admin":131000,
          "member":[
              101,
              102
          ]
}

我正在这样调用路线 household.index {{#link-to "households.index" user.id}} 我在 household.index 中的路线看起来像这个

model(params) {
    //holt alle Haushalte und gibt dann nur die Haushalte weiter, die auch den aktuellen Benutzer als Member haben.
   return this.get('store').findAll('household').then(results => results.filter((site) => {
       return site.get('member').filter(x => x == params.user_id).length > 0;
   }));
  }

我在海市蜃楼的 config.js 角色是这样的：

  this.get('/households', function(db, request) {
    return { households: data.households };   
});

这很好用！但在我看来，服务器负责向我提供我请求的数据。所以我只想发送一个特定的请求，然后得到我需要的家庭。

我的尝试： index.js:

export default Route.extend({
    model(params) {
        return this.get('store').find('household', params.user_id);
      }
});

配置js部分：

  this.get('/households/:id', function(db, request) {
      console.log('household get');
      console.log(data.households.filter(x => x.member.filter(x => x == request.params.id).length > 0));
    return  { households: data.households.filter(x => x.member.filter(x => x == request.params.id).length > 0) };   
});

调试错误：

Error while processing route: households.index payload.data is null

我不明白为什么会出现这个错误。日志给了我想要 return 的数组。

Answer 1

默认情况下 Ember 数据随 JSONAPISerializer 一起提供，这假设了一些关于您的服务器（在本例中为 mirage）格式化数据的方式。在这种情况下，预计 Mirage 返回的文档通常符合 JSON API Spec 并具有响应的主要数据所在的顶级成员 data。

如果您希望坚持使用自定义格式的回复，您可能需要查看 Ember 数据的 JSONSerializer。否则，返回以下内容会让你更接近：

return  { data: db.households.filter(x => x.member.filter(x => x == request.params.id).length > 0) };

或者您可以利用 Mirage

附带的 JSONAPISerializer

在这里查看更多内容Ember Guides | Serializers

Answer 2

确保您在 mirage 中使用 RestSerializer，

// mirage/serializers/application.js
import { RestSerializer } from 'ember-cli-mirage';

export default RestSerializer;

关于正确的格式，请参考 RESTAdapterAPI。

只要确保您返回的数据格式如下，

对于单个响应，

{
  "posts": {
    "id": 1,
    "title": "I'm Running to Reform the W3C's Tag",
    "author": "Yehuda Katz"
  }
}

如果不止一个，

{
  "posts": [
    {
      "id": 1,
      "title": "I'm Running to Reform the W3C's Tag",
      "author": "Yehuda Katz"
    },
    {
      "id": 2,
      "title": "Rails is omakase",
      "author": "D2H"
    }
  ]
}

Ember 从 store/mirage 获取过滤后的数据

Ember get filtered data from the store/mirage

javascript

ember.js

ember-data

ember-cli-mirage