Vuejs2 Vue对非冻结数据的冻结列表进行排序

我有一个非冻结数据的冻结列表，目的是容器不是反应性的，但元素是反应性的，因此对N个事物之一的更新不会触发对N个事物的依赖性检查

我有一个computed属性，它返回此列表的排序版本。但是Vue会看到冻结列表中包含的反应对象，对元素的任何更改都会触发已排序的计算属性。（目标是仅在有关排序的某些数据发生更改时触发它，如方向或主要索引等）

一般概念是：

{
    template: someTemplate,
    data() {
        return {
            list: Object.freeze([
                Vue.observable(foo),
                Vue.observable(bar),
                Vue.observable(baz),
                Vue.observable(qux)
            ])
        }
    },
    computed: {
        sorted() {
            return [...this.list].sort(someOrdering);
        }
    }
}

是否有Vue习惯用法，或者我缺少的东西？

…对元素的任何更改都会触发排序属性

我不同意那种一般性的说法。看看下面的例子。如果列表按名称排序，单击“更改年龄”不会触发重新计算，反之亦然。因此，只有在上一次排序期间使用的属性发生更改时才会触发重新计算

const-app=新的Vue({
el:“应用程序”，
数据（）{
返回{
列表：Object.freeze([
Vue.可观察（{姓名：“Foo”，年龄：22}），
Vue.可观察（{姓名：“酒吧”，年龄：26}），
Vue.可观察（{姓名：“Baz”，年龄：32}），
Vue.可观察（{姓名：“Qux”，年龄：52}）
]),
sortBy:“name”，
柜台:0
}
},
计算：{
排序（）{
log（`Sort executed${this.counter++}次`）
return[…this.list].sort（（a，b）=>{
返回a[this.sortBy]b[this.sortBy]？1:0）
});
}
}
})
Vue.config.productionTip=false；
Vue.config.devtools=false

排序依据：{{sortBy}

改名
更年期

按名称排序
按年龄分类

{{item.name}}（{{item.age}}）
只需使用
watch
over
someOrdering
而不是computed propa
watch
就可以了，因为排序工作正常