在我的应用程序中,我有一个主模型,我们称之为users
。我有一个模块users
和一个名为list
的子模块。
在消费api端点时,我将10个用户作为一组用户返回。对于每个用户,我使用user
作为密钥为list
users
模块中的每个模块动态注册id
模块。
this.registerModule(['users', 'list', user.id], UserModule);
然后我发送一些动作来保存我店里的数据。一切正常。
我有一个getter,它将list
模块(包含id
的对象作为指向user
的键的对象)解析为一组用户。它看起来像这样:
users: (state) => {
const users = Object.keys(state.list).map(key => state.list[key]);
return users;
}
当vuex
动态注册单个UserModule
时,它会按字母顺序在list
模块中对它们进行排序,而不是模块注册的顺序。这是一个问题,因为我希望用户数组的顺序与从api进入的顺序相同。
如果端点返回2个这样的用户:
[
{ id: '3', name: 'Bob'},
{ id: '1', name: 'Tom'}
]
然后列表模块将如下所示:
state: {
list: {
1: { id: '1', name: 'Tom'},
3: { id: '3', name: 'Bob'}
}
}
然后users
getter会返回:
[
{ id: '1', name: 'Tom'},
{ id: '3', name: 'Bob'},
]
我的初步解决方案是在每个模块被消耗时将一个订单属性注入到该订单属性的getter排序中。它感觉不太好,因为我觉得我正在添加循环来无缘无故地排序。