代码之家 › 专栏 › 技术社区 › NormX

如何解析JSON响应并在数组中存储值

react-select reactjs json arrays javascript

NormX · 技术社区 · 5 年前

我使用react select async从通过API传递的输入加载选项。我得到一个JSON响应,其中有一个列表,其中有一个字段“FullName”,我试图遍历JSON文件并将所有字段名存储在一个数组中。然后将数组作为选项返回。

JSON中有一个列表,列表包含结果,每个数字都有一个全名

JSON响应的格式:

version:
status:
-status code
-status message
error:
result:
-paginate
list:
-0
--FullName

下面是我的课,我展示了我认为我的问题所在 -----

class ReactSelectExample extends Component {
  constructor(props, context) {
    super(props, context);
    this.state = {
        selectedOption: {}
    }
  }

fetchData = (inputValue, callback) => {
    if (!inputValue) {
      callback([]);
    } else {
        setTimeout(() => {
  fetch("-----API URL----" + inputValue, {
    method: "GET",
  })
  .then((resp) => {
    return resp.json()
  }) 
----------------
  .then((data) => {
      const tempArray = [];
     data.forEach((element) => {
            tempArray.push({ label: `${element.fullname}`, value: element.FullName });
     });
     callback(tempArray);   
---------------       
  })
  .catch((error) => {
    console.log(error, "catch the hoop")
  });
});
}
}

 onSearchChange = (selectedOption) => {
    if (selectedOption) {

    this.setState({
        selectedOption
       });
    }
  };
  render() {
      return ( <div>
           <AsyncSelect
                value={this.state.selectedOption}
                loadOptions={this.fetchData}
                placeholder="Admin Name"
                onChange={(e) => {
                    this.onSearchChange(e);
                }}
                defaultOptions={false}
            />
      </div>)
  }

}