未捕获类型错误：无法读取属性'；地图'；reactjs中未定义的 从“React”导入React； 从“react dom”导入react dom； var axios=需要（“axios”）； 类应用程序扩展React.Component{ 构造函数（）{ 超级（）； this.handleClick=this.handleClick.bind（this）； 此.state={ 下拉项：[] }; } deleteDd（索引）{ 让dropdownItems=this.state.dropdownItems.filter（item=>item！==index）； this.setState（{dropdownItems:dropdownItems}）； } handleClick（）{ 让dropdownItems=[…this.state.dropdownItems]； dropdownItems.push（dropdownItems.length）； this.setState（{dropdownItems:dropdownItems}）； } getInitialState（）{ 返回{ 公司：[] } } //通过将json对象传递到url，尝试将json数据导入下拉列表 componentDidMount（）{var\u this=this； this.serverRequest=axios .get（“myurl”） .then（函数（结果）{ _这是我的国家({ 公司：result.data.company }); //console.log（作业）； }) } 组件将卸载（）{ 这是.serverRequest.abort（）； } render（）{ let dropdowns=this.state.dropdownItems.map（项=> ()); 返回( 较高的 中心 基础知识 选一个 测试 测试1 //这里是我的所有json数据驻留在公司的地方 公司！ {this.state.company.map（函数（公司））{ 返回( {company.company} );})}

我收到此错误“UncaughtTypeError:无法读取未定义的属性“map”我正在尝试将json数据加载到下拉列表中。请帮助。我已经尝试了所有可能的方法，但仍然无法找出问题所在，非常感谢您的帮助。

当您扩展React.Component以创建React组件时，getInitialState不会初始化状态变量。您需要在

co中执行此操作构造函数

.hne当您将

公司

初始化为空数组以使用

getInitialState（）

进行状态设置时，它没有对其进行设置，因此最初

此.state.company

未定义

在构造函数中初始化状态应该可以。另外，为了避免任何问题，您可以在映射之前执行未定义的检查，如

{this.state.company&&this.state.company.map（function（company）{…}}

从“React”导入React；
从“react dom”导入react dom；
var axios=需要（“axios”）；
类应用程序扩展React.Component{
构造函数（）{
超级（）；
this.handleClick=this.handleClick.bind（this）；
此.state={
下拉项：[]，
公司：[]
};
}        
deleteDd（索引）{
让dropdownItems=this.state.dropdownItems.filter（item=>item！==index）；
this.setState（{dropdownItems:dropdownItems}）；
}        
handleClick（）{
让dropdownItems=[…this.state.dropdownItems]；
dropdownItems.push（dropdownItems.length）；
this.setState（{dropdownItems:dropdownItems}）；
}        
//通过将json对象传递到url，尝试将json数据导入下拉列表
componentDidMount（）{var\u this=this；
this.serverRequest=axios
.get（“myurl”）
.then（函数（结果）{
_这是我的国家({
公司：result.data.company
});
//console.log（作业）；
})
}        
组件将卸载（）{
这是.serverRequest.abort（）；
}
render（）{
let dropdowns=this.state.dropdownItems.map（项=>
());        
返回(
较高的
中心
基础知识
选一个
测试
测试1
//这里是我的所有json数据驻留在公司的地方
公司！
{this.state.company&&this.state.company.map（函数（公司））{
返回(
{company.company}
);})}

当您扩展React.Component以创建React组件时，getInitialState不会初始化状态变量。您需要在

构造函数中执行此操作。当您将
公司
初始化为空数组以使用
getInitialState（）进行状态时，请执行此操作
，它没有设置它，因此最初未定义此.state.company

在构造函数中初始化状态应该可以。另外，为了避免任何问题，您可以在映射之前执行未定义的检查，如
{this.state.company&&this.state.company.map（function（company）{…}}

从“React”导入React；
从“react dom”导入react dom；
var axios=需要（“axios”）；
类应用程序扩展React.Component{
构造函数（）{
超级（）；
this.handleClick=this.handleClick.bind（this）；
此.state={
下拉项：[]，
公司：[]
};
}        
deleteDd（索引）{
让dropdownItems=this.state.dropdownItems.filter（item=>item！==index）；
this.setState（{dropdownItems:dropdownItems}）；
}        
handleClick（）{
让dropdownItems=[…this.state.dropdownItems]；
dropdownItems.push（dropdownItems.length）；
this.setState（{dropdownItems:dropdownItems}）；
}        
//通过将json对象传递到url，尝试将json数据导入下拉列表
componentDidMount（）{var\u this=this；
this.serverRequest=axios
.get（“myurl”）
.then（函数（结果）{
_这是我的国家({
公司：result.data.company
}
import React from 'react';
import ReactDOM from 'react-dom';
var axios = require('axios');
class Application extends React.Component {        
  constructor() {
    super();
    this.handleClick = this.handleClick.bind(this);        
    this.state = {
      dropdownItems: []
    };
  }        
  deleteDd(index) {
    let dropdownItems =  this.state.dropdownItems.filter(item => item!==index);
    this.setState({dropdownItems: dropdownItems});
  }        
  handleClick() {
    let dropdownItems = [...this.state.dropdownItems];
    dropdownItems.push(dropdownItems.length);
    this.setState({dropdownItems: dropdownItems});
  }        
getInitialState() {
    return {
      company: []
    }
  }
//trying to get json data into dropdown by passing the json object into the url         
  componentDidMount(){var _this = this;
    this.serverRequest = axios

        .get("myurl")
        .then(function(result) {    
          _this.setState({
            company: result.data.company        
          });
          //console.log(jobs);
        })
  }        
  componentWillUnmount(){
    this.serverRequest.abort();
  }
  render() {
    let dropdowns = this.state.dropdownItems.map(item =>
      (<MyDropdown key = {item} num = {item} onDeleteMe ={this.deleteDd.bind(this, item)} />));        
    return (
    <div>
    <h1 className="text-left page-title">Higher</h1>
    <h2 className="text-left">CTR</h2>
    <h3 className="text-left">ABC</h3>            
    <div>       
            <form>
    <select className="dropdown menu dropdown-style" data-dropdown-menu>
                        <option defaultValue>Choose one</option>
                        <option value="test">test</option>
                        <option value="test1">test1</option>               
                    </select>
      //here is where all my json data resides in company              
        <h1>Companies!</h1>
        {this.state.company.map(function(company) {
          return (
            <div key={company.id} className="company">                      
                {company.Company}      
                                 </div>);})}
            </form>

import React from 'react';
import ReactDOM from 'react-dom';
var axios = require('axios');
class Application extends React.Component {        
  constructor() {
    super();
    this.handleClick = this.handleClick.bind(this);        
    this.state = {
      dropdownItems: [],
      company: []
    };
  }        
  deleteDd(index) {
    let dropdownItems =  this.state.dropdownItems.filter(item => item!==index);
    this.setState({dropdownItems: dropdownItems});
  }        
  handleClick() {
    let dropdownItems = [...this.state.dropdownItems];
    dropdownItems.push(dropdownItems.length);
    this.setState({dropdownItems: dropdownItems});
  }        

//trying to get json data into dropdown by passing the json object into the url         
  componentDidMount(){var _this = this;
    this.serverRequest = axios

        .get("myurl")
        .then(function(result) {    
          _this.setState({
            company: result.data.company        
          });
          //console.log(jobs);
        })
  }        
  componentWillUnmount(){
    this.serverRequest.abort();
  }
  render() {
    let dropdowns = this.state.dropdownItems.map(item =>
      (<MyDropdown key = {item} num = {item} onDeleteMe ={this.deleteDd.bind(this, item)} />));        
    return (
    <div>
    <h1 className="text-left page-title">Higher</h1>
    <h2 className="text-left">CTR</h2>
    <h3 className="text-left">ABC</h3>            
    <div>       
            <form>
    <select className="dropdown menu dropdown-style" data-dropdown-menu>
                        <option defaultValue>Choose one</option>
                        <option value="test">test</option>
                        <option value="test1">test1</option>               
                    </select>
      //here is where all my json data resides in company              
        <h1>Companies!</h1>
        {this.state.company && this.state.company.map(function(company) {
          return (
            <div key={company.id} className="company">                      
                {company.Company}      
                                 </div>);})}
            </form>