小编Mat*_*een的帖子

我认为 ES6 模块导出总是不可变的，所以我对我得到的行为感到非常困惑。我有一个简单的颜色数组，我想在我的 Vue 应用程序的多个组件中使用它们。它在它自己的文件中，如下所示：

export const colors = [
  '#ffb3ba',
  '#ffdfba',
  '#ffffba',
  '#bae1ff',
]

然后我将它导入到我想像这样使用它的组件中：

import { colors } from '../assets/colors';

我有一个选择随机颜色然后从列表中删除它的功能，这样就不会为同一个组件再次选择它。它是这样的。

descriptions.forEach(item => {
      const colorIndex = Math.floor(Math.random() * colors.length);
      item['color'] = colors[colorIndex];
      colors.splice(colorIndex, 1);
    });

这里的想法是从列表中随机选择一种颜色，为其分配描述，然后将其从列表中删除，以便在forEach.

问题是它似乎从列表中永久删除了颜色。因此，当我导入并尝试在另一个组件中使用该数组时，其中没有颜色。我怎样才能让colors每个组件都有一个新的数组实例？