【问题标题】:How does Ember Data write over instances of stored model dataEmber Data 如何覆盖已存储模型数据的实例
【发布时间】:2017-09-03 14:02:15
【问题描述】:

好的,所以我是 Ember 的新手,所以请耐心等待。

我有一个 Ember 应用程序正在与不符合 JSONAPI 标准的 API 进行通信,因此我已经开始编写自己的序列化程序以使用 Ember 数据。但是,我发现当我对同一资源发出多个请求时,数据无法写入存储。对同一资源的连续请求总是响应以下错误:

TypeError:无法将对象转换为原始值

根据我的有限理解,这意味着我发送到商店的数据被视为字符串。

在我的应用程序路线中,我已将findAll 写入我的模型“列表项”,如下所示:

model: function() {
  return this.store.findAll('listing-item');
},

在嵌套的“用户”路由中,当我对列表项数据执行任何类型的请求并返回列表项数据的数组响应(查询、findAll)时,我得到:

TypeError: Cannot convert object to primitive value

at EmptyObject.SETTER_FUNCTION [as title] (ember.debug.js:20672)
at assign (<anonymous>)
at InternalModel.setupData (internal-model.js:244)
at Class._load (store.js:1728)
at Class._pushInternalModel (store.js:2055)
at Class._push (store.js:1995)
at finders.js:141
at Backburner.run (ember.debug.js:720)
at Class._adapterRun (store.js:2253)
at finders.js:139

(标题是我的列表项模型中的一个字段)。

正如我之前提到的,我的 API 不符合 JSONAPI 标准,所以我编写了一个列表项序列化器,如下所示:

import DS from 'ember-data';

export default DS.RESTSerializer.extend({

  normalizeArrayResponse(store, primaryModelClass, payload) {

    payload.data = [];
    payload.listing_item._data.forEach(this.formatListingItemArray, payload.data);
    delete payload.listing_item;

    return payload;
  },

  formatListingItemArray(listingItem) {
    this.push({
      type: "listing-item",
      id: listingItem.id,
      attributes: {
        title: listingItem.title,
        description: listingItem.description,
        buy_now_price: listingItem.buy_now_price,
        created_at: listingItem.created_at,
        category_id: listingItem.category_id,
        subcategory_id: listingItem.subcategory_id,
        identity_id: listingItem.identity_id,
        listing_number: listingItem.listing_number,
        brand_new: listingItem.brand_new,
        sold: listingItem.sold,
      },
    });
  },

});

所以我想我的问题是,Ember Data 对我的数据对象做了什么导致此错误发生,以及我在格式化我的数据以供 Ember 数据使用时可能做错了什么。

更新:

似乎只有前 3 个字段会导致此错误发生。如果我在序列化程序中注释掉属性“title”、“description”和“buy_now_price”,我不会收到此错误。此外,这似乎只在我导航到路由时发生,如果我在应用程序加载时位于 /user 路由中,则两个请求都按预期工作。

好的,所以我一直在爬取 ember-data 代码,发现在 internal-model.js 文件中有一个设置函数,它查看存储中的当前属性并将它们与传递的数据进行比较序列化器。然后它执行 assign() 将序列化程序的新数据复制到存储对象。但是由于某种原因,我的商店对象似乎有一组“getter”和“setter”函数,它们从商店返回有问题的字段(标题、描述和 buy_now_price)。我现在需要知道的是,为什么这些功能会出现,我做了什么导致这种情况发生?

Picture of getters/setters on ember-data object

提前致谢,如果我需要提供更多信息以便提供更好的上下文,请告诉我。

【问题讨论】:

    标签: ember.js ember-data


    【解决方案1】:

    因此,我为遇到类似问题的任何人找到了解决问题的方法。

    症状如上所述,似乎 ember-data 正在从商店返回 getter 和 setter 函数,并且在替换我的新值时遇到问题。然而,线索是它只是我在模板中呈现的字段。

    问题似乎是我使用 Ember 并发任务来执行数据加载,然后将任务直接从模型模板传递到内部组件。像这样的东西(未经测试的代码):

    错误的模式(我用来解决问题的模式)。

    //route file - application.js
    export default Ember.Route.extend({
    
      model: function() {
        return {
          listings: this.get('getListings').perform(),
        };
      },      
    
      getListings: task(function * () {
        return yield this.store.findAll('listing-item');
      }),
    
    })
    
    
    //application template - application.hbs
    {{listing-index listings=model.listings}}
    
    
    //listing index component template.hbs
    {{#if listings.value}}
      {{#each listings.value.content as |listing|}}
        {{listing._data.title}}
        {{listing._data.description}}
        {{listing._data.buy_now_price}}
      {{/each}}
    {{/if}}
    

    正确的模式似乎是这样的:

    //route file - application.js
    
    export default Ember.Route.extend({
    
      model: function() {
        return {
          listings: this.get('getListings').perform(),
        };
      },      
    
      getListings: task(function * () {
        return yield this.store.findAll('listing-item');
      }),
    
    })
    
    
    //application template - application.hbs
    {{#if listings.value}}
      {{listing-index listings=model.listings.value}}
    {{/if}}
    
    
    //listing index component template.hbs   
    {{#each listings as |listing|}}
      {{listing.title}}
      {{listing.description}}
      {{listing.buy_now_price}}
    {{/each}}
    

    所以问题似乎在于这种将任务而不是任务内容传递给我的组件的模式。当我遍历模型模板中的列表然后将列表直接传递给组件时,它似乎解决了我的问题。我认为这与使用这些 _data 属性有关。进一步的解释将不胜感激,但我现在将其标记为已解决。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-09-04
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-11-22
      相关资源
      最近更新 更多