【问题标题】:Ember.computed.sort property not updatingEmber.computed.sort 属性未更新
【发布时间】:2016-09-26 09:52:53
【问题描述】:

过去几天我一直在绞尽脑汁,试图了解我做错了什么。 我正在为我的应用程序实现列表基础结构,其中可以包括paging/infinite scroll/filtering/grouping/etc。该实现基于扩展控制器(不是数组控制器,我希望 Ember 2.0 安全),并带有一个保存数据的 content 数组属性。

我正在使用 Ember.computed.sort 进行排序,它正在工作,但是当我尝试更改排序器时出现了奇怪的行为。 sortedContent 未在 displayContent 中更新,即使 sortingDefinitions 定义已更新。

这会导致一个奇怪的行为,它只会在我 sort 两次时才会排序,就好像排序是异步的一样。

我正在使用Ember 1.5(但它也发生在 1.8 上) (附上一段解释我的问题的代码)

sortingDefinitions: function(){
    var sortBy = this.get('sortBy');
    var sortOrder = this.get('sortOrder') || 'asc';

    if (_.isArray(sortBy)) {
        return sortBy;
    }
    else {
        return (sortBy ? [sortBy + ':' + sortOrder] : []);
    }
}.property('sortBy', 'sortOrder'),

sortedContent: Ember.computed.sort('content', 'sortingDefinitions'),




displayContent: function() {
    var that = this;
    var sortBy = this.get('sortBy');
    var sortOrder = this.get('sortOrder');
    var list = (sortBy ? this.get('sortedContent') : this.get('content'));

    var itemsPerPage = this.get('itemsPerPage');
    var currentPage = this.get('currentPage');
    var listItemModel = this.get('listItemModel');

    return list.filter(function(item, index, enumerable){
        return ((index >= (currentPage * itemsPerPage)) && (index < ((currentPage + 1)  * itemsPerPage)));
    }).map(function(item) {
        var listItemModel = that.get('listItemModel');
        if (listItemModel) {
            return listItemModel.create(item);
        }
        else {
            return item;
        }
    });

}.property('content.length', 'sortBy', 'sortOrder', 'currentPage', 'itemsPerPage')

编辑: 通过向 displayContent (sortedContent.[]) 添加另一个依赖项来修复:

displayContent: function() {
    ....

}.property('content.length', 'sortBy', 'sortOrder', 'currentPage', 'itemsPerPage' , 'sortedContent.[]')

【问题讨论】:

  • 请注意,它在我的单元测试中运行良好。渲染循环的东西在这里搞砸了。

标签: ember.js


【解决方案1】:

您的排序函数正在观察整个数组sortingDefinitions,而不是数组中的每个元素。如果数组更改为字符串或其他变量,它将更新,但如果数组中的元素更改,则不会。

为确保您的计算属性正确更新,请在数组末尾添加 .[],使其如下所示:Ember.computed.sort('content', 'sortingDefinitions.[]')

【讨论】:

  • 但整个阵列正在被替换。真正奇怪的部分是,当排序两次时,它起作用了。 (无论如何尝试了您的解决方案,但没有用):(
  • 好的,我发现了这个问题,而且没有什么不同。将“sortedContent.[]”添加到 displayContent 属性列表就可以了。我的错。
猜你喜欢
  • 2018-09-02
  • 2012-02-04
  • 2017-02-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-01-06
  • 2018-02-22
  • 2019-04-18
相关资源
最近更新 更多