javascript - Enyo 集合合并策略

标签 javascript collections enyo

下面是我用来在单击“更多”按钮后从服务提供商获取更多照片的功能:

showMore: function(){
        this.$.resultList.collection.fetch({strategy:"merge",rpp:50});
    }

这将调用集合中定义的 fetch 方法,

fetch: function(opts) {
        this.params = {
            feature: this.methodType || "popular",
            image_size: 3,
            sort: "created_at",
            rpp: opts && opts.rpp || 25
        };
        return this.inherited(arguments);
    },

这工作正常,但问题是一旦再次单击按钮,它应该获取另一组 25 张照片并将其附加到我的收藏中,但实际发生的情况有时是,它只显示 5 张照片以及之前的照片。

我对“合并”策略的理解是,如果收到的记录与以前的记录相同,它将只采用那些与以前获取的记录不同的记录并更新重复记录的主键。所以我的原因之一可以看出,下次可能会获取25张照片,但由于大多数照片与之前相同,所以只显示与之前获取的照片不同的照片。

如果我采用“添加”策略,它一次可以正常工作,即,它显示附加到集合中的另一组 25 张照片,其中大多数都是相同的。但是,如果再次单击“更多”按钮,则不会将任何记录添加到集合中。不知道为什么会发生这种情况。

如果我只想获取新照片并将其附加到集合中,我应该如何处理。

最佳答案

使用合并策略是正确的方法。您对合并的描述基本上是准确的,只是它不更新主键,而是更新具有相同主键的现有记录的数据。

很难说为什么使用“add”并不总是有效。如果记录没有主键(默认为 id),“添加”和“合并”应始终将记录添加到集合中(除非您使用 mergeKeys)。如果它们确实有主键,则您可能会尝试添加重复记录,Enyo 会提示并中止。检查您的控制台日志。

如果没有代码,唯一的其他建议是设置断点并单步执行 enyo.Collection.merge。

这是一个example of fetching records into a collection 。如果注释掉设置id,合并和添加策略将始终添加记录。如果注释掉合并策略,代码最终会在请求更多记录时出错。

enyo.kind({
    name: "ex.MockSource",
    kind: "enyo.Source",

    fetch: function(rec, opts) {
        if(rec instanceof enyo.Model) {
            rec.setObject(Faker.Helpers.createCard());
        } else if (rec instanceof enyo.Collection) {
            var count = opts && opts.count || 25;
            var cards = [];
            for(var i=0;i<count;i++) {
                var card = Faker.Helpers.createCard();

                // artificial id to force merges
                card.id = enyo.now()%40;
                cards.push(card);
            }

            opts.success(cards);
        }
    }
});

enyo.store.addSources({
    mock: "ex.MockSource"
});

enyo.kind({
    name: "ex.App",
    kind: "Scroller",
    bindings: [
        {from: ".data", to: ".$.list.collection"},
        {from: ".data.length", to: ".$.count.content", transform: function(v) {
            return enyo.format("Displaying %s records", v);
        }}
    ],
    components: [
        {name: "count"},
        {name: "list", kind: "DataRepeater", components: [
            {kind: "onyx.Item", components: [
                {name: "name"},
                {name: "phone"}
            ], bindings: [
                {from: ".model.name", to: ".$.name.content"},
                {from: ".model.phone", to: ".$.phone.content"}
            ]}
        ]},
        {kind: "onyx.Button", content: "More", ontap: "moreTapped"}
    ],
    create: enyo.inherit(function(sup) {
        return function() {
            sup.apply(this, arguments);
            this.set("data", new enyo.Collection({
                defaultSource: "mock"
            }));

            this.fetchRecords();
        };
    }),

    fetchRecords: function() {
        this.data.fetch({
            count: 5,
            strategy: "merge"
        });
    },

    moreTapped: function() {
        this.fetchRecords();
    }
});

new ex.App().renderInto(document.body);

关于javascript - Enyo 集合合并策略,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23469763/

相关文章:

javascript - 如何将 jQuery 模板集成到 React App 中

javascript - Jquery - 为什么在选择器上使用它不起作用?

使用集合时的java无限循环

javascript - 如何将 onyx.Picker 重置为预选状态

javascript - 将 D3 block 转换为 Enyo 组件

javascript - Enyo 中创建函数和渲染函数之间的场景差异

javascript - 如何获取包含 icon-(icon-name) 并附加 <span class ="glyp + icon-name"></span> 的所有类

javascript - 当div元素出现在视口(viewport)中时触发动画

C# 集合 - 按元素排序(旋转)

java并发数组列表访问