javascript - 从 Javascript 对象动态创建数组列表

Question

好的，所以我想创建一个包含美国不同州的选择器，我将使用 this包，用于输入:

var usStates = new UsaStates();
console.log(usStates.states);`

输出:

{
    name: "Alabama",
    abbreviation: "AL",
    territory: false,
    capital: "Montgomery",
    contiguous: true
},
{
    name: "Alaska",
    abbreviation: "AK",
    territory: false,
    capital: "Juneau",
    contiguous: false
},
...(other states omitted for brevity)
{
    name: "Wyoming",
    abbreviation: "WY",
    territory: false,
    capital: "Cheyenne",
    contiguous: true
}

我已经有了一个选择器组件，但它需要像这样的选项作为数组属性:

<LNSelect
                options={[
                  { label: "Alabama", value: "AL" },
                  { label: "New York", value: "NY" },
                ]}
></LNSelect>

如何使用包的功能以必要的格式创建一个数组，其中标签作为名称，值作为缩写？

非常感谢!

Answer 1

转换数组通常用 map 完成.如果状态数组已经以该格式提供，则只需在状态数组上调用 map ，或使用 Object.entries()将对象转换为数组以用于 map 。

const states = [{
    name: "Alabama",
    abbreviation: "AL",
    territory: false,
    capital: "Montgomery",
    contiguous: true
},
{
    name: "Alaska",
    abbreviation: "AK",
    territory: false,
    capital: "Juneau",
    contiguous: false
},
{
    name: "Wyoming",
    abbreviation: "WY",
    territory: false,
    capital: "Cheyenne",
    contiguous: true
}];

const options = states.map(state => {
  return {
    label: state.name,
    value: state.abbreviation
  }
});

console.log(options);