如何从 React JS 中的另一个组件导入多个变量或列表？

Question

我有一个 Profile.js 组件，它使用了一些列表。 该列表很大，因此我想将列表转移到不同的 LabelValue.js 组件并将其导入 Profile.js。 但我不能这样做。 请描述正确的进出口方式。

在 LabelValue.js 中

const bloodGroups = [
  { label: "Choose", value: "" },
  { label: "A+", value: "A+" },
  { label: "B+", value: "B+" },
  { label: "AB+", value: "AB+" },
  { label: "O+", value: "O+" },
  { label: "O-", value: "O-" },
  { label: "A-", value: "A-" },
  { label: "B-", value: "B-" },
  { label: "AB-", value: "AB-" },
];

 const genders = [
    { label: "Choose", value: "" },
    { label: "Male", value: "Male" },
    { label: "Female", value: "Female" },
    { label: "Others", value: "Others" },
  ];

export default { genders, bloodGroups };

在 Profile.js 中

import { bloodGroups, genders } from ".path/to/LabelValue.js"

错误

./src/Pages/Profile.js
Attempted import error: 'bloodGroups' is not exported from '../LabelValue'.

Answer 1

利用

export { genders, bloodGrousps };

不是

export default { genders, bloodGrousps };

默认为单个值