代码之家 › 专栏 › 技术社区 › panx36

Ember从商店/幻影中获取过滤数据

ember-cli-mirage ember-data ember.js javascript

panx36 · 技术社区 · 8 年前

我正在尝试使用ember为smarthome设备构建一个应用程序。我已经安装了mirage并声明了一个名为data的数组。它容纳家庭、用户和设备等阵列。现在我只能从商店中获取过滤后的数据,我真的被商店的行为搞糊涂了。基于这个原因,我已经读过一些类似的话题了 Filtering store data in ember 但这在我的情况下不起作用。

实际上这是我的路由器。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');
  });
});

如果我要去家庭。索引我想看到在他的成员数组中有用户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
          ]
}

我正在给这条路打电话。像这样的索引{{#链接到“houses.index”user.id}}和我在house中的路径。索引如下所示

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;
   }));
  }

和我的配置。海市蜃楼的js部分如下:

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

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

我的尝试: 指数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) };   
});

调试错误:

处理路由时出错:家庭。索引有效载荷。数据为空

我不明白为什么会发生这种错误。日志给了我想要返回的数组。

2 回复 | 直到 8 年前

Ember Freak 8 年前

确保在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"
    }
  ]
}

yohanmishkin 8 年前

默认情况下,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) };

或者你可以利用 JSONAPISerializer公司 随附的 Mirage

在此处查看更多信息 Ember Guides | Serializers