如何将此数据映射到 React 中的 json 数组？

Question

我有一个 Rest API returns 数据 json 的形式：

["1.6.3","1.6.4","1.6.5","1.6.6","1.7.0","1.7.2"]

我需要这种格式的数据：

var options = [{ value: 'one', label: 'One' }, { value: 'two', label: 'Two', clearableValue: false }
 ];

获取数据后，我使用以下代码以所需格式映射数据：

if (this.state.coreversions) {
                var options = [
                    this.state.coreversions.map(versions =>
                        `{ value: '${versions}', label: '${versions}' },`
                    )
                ];
            }

这里变量version等于Rest返回数据的单个值API

如有任何帮助，我们将不胜感激。

Answer 1

Array#map returns 数组，因此您不必将其括在方括号中。

修改您的代码如下：

if (this.state.coreversions) {
  var options = this.state.coreversions.map(
    versions => ({value: versions, label: versions})
  );
}

// simplified this.state.coreversions to just coreversions
// only for the purposes of this snippet
var coreversions = ["1.6.3","1.6.4","1.6.5","1.6.6","1.7.0","1.7.2"];

if (coreversions) {
  var options = coreversions.map(
    versions => ({value: versions, label: versions})
  );
}

console.log(options);

// logs out an array of objects:
//  [
//    { value: '1.6.3', label: '1.6.3' },
//    { value: '1.6.4', label: '1.6.4' },
//    { value: '1.6.5', label: '1.6.5' },
//    { value: '1.6.6', label: '1.6.6' },
//    { value: '1.7.0', label: '1.7.0' },
//    { value: '1.7.2', label: '1.7.2' }
//  ]

Answer 2

我认为您的 map 函数是 returning 字符串数组而不是对象。应该是这样的：

return { 值：'${versions}'，标签：'${versions}' }

请注意，上面的内容没有围绕整条线的刻度。

Answer 3

React-Select 需要一个对象数组，而不是一个字符串数组。

您可以遍历数据，将这些值放在一个对象中，然后将其推送到一个数组中，如下所示：

var results = ["1.6.3", "1.6.4", "1.6.5", "1.6.6", "1.7.0", "1.7.2"];

var selectData= [];

for (result of results) {
  selectData.push({
    value: result,
    label: result
  });
}

console.log(selectData);

如何将此数据映射到 React 中的 json 数组？

How to map this data to a json array within React?

javascript

json

reactjs

react-select