时间戳

首页 > 解决方案 > 设置动态注册模块的顺序

javascript - 设置动态注册模块的顺序

问题描述

在我的应用程序中，我有一个主要模型，我们称它们为users. 我有一个模块users和一个名为list.

在使用 api 端点时，我将 10 个用户作为一组用户返回。对于每个用户，我使用作为键为模块内的每个用户动态注册一个user模块。listusersid

this.registerModule(['users', 'list', user.id], UserModule);

然后我发送一些动作来补充我商店中的数据。这一切都很好。

我有一个 getter 将list模块（一个包含id' 作为指向 a 的键的对象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吸气剂将返回：

[
  { id: '1', name: 'Tom'},
  { id: '3', name: 'Bob'},
]

我的暂定解决方案是在每个模块被消耗时将 order 属性注入到每个模块中，然后按该 order 属性在 getter 排序中。感觉不太好，因为我觉得我无缘无故地添加了一个循环来排序。

问题

  1. 有没有办法在它们进来时动态地订购注册模块，而不是按字母顺序排列？
  2. 除了注入“订单”属性之外，谁能想到更好的解决这个问题的方法？

标签： javascriptvue.jsvuejs2vuex

解决方案

推荐阅读