Javascript 反应+;Axios:Uncaught(承诺中)类型错误:无法读取属性';地图';未定义的

Javascript 反应+;Axios:Uncaught(承诺中)类型错误:无法读取属性';地图';未定义的,javascript,reactjs,axios,Javascript,Reactjs,Axios,尝试通过一个简单的Axios教程来开始习惯填充动态数据 我必须创建一个JSON web服务器,因为用localhost点击Codepen违反了CORS App.jsx var App = React.createClass({ getInitialState: function(){ return{ users: [] }; }, componentDidMount: function(){ var _this = this; this

尝试通过一个简单的Axios教程来开始习惯填充动态数据

我必须创建一个JSON web服务器,因为用localhost点击Codepen违反了CORS

App.jsx

var App = React.createClass({
  getInitialState: function(){
    return{
      users: []
    };
  },  
  componentDidMount: function(){
    var _this = this;
    this.serverRequest =
      axios
        .get("http://localhost:3004/users")
        .then(function(results){
          console.log(results.data);
          _this.setState({
            users: results.data.users
          });
         });
  },
  componentWillUnmount: function(){
    //...
  },
  render: function(){
    return(
        <div>
          <h3>Returning Users:</h3>
            {this.state.users.map(function(user) {
          return (
            <div>{user.name}</div>
          );
         })}
        </div>
    );
  }
});

export default App;
var-App=React.createClass({
getInitialState:函数(){
返回{
用户:[]
};
},  
componentDidMount:function(){
var_this=这个;
此为.serverRequest=
axios
.get(“http://localhost:3004/users")
.然后(函数(结果){
console.log(results.data);
_这是我的国家({
用户:results.data.users
});
});
},
componentWillUnmount:function(){
//...
},
render:function(){
返回(
返回用户:
{this.state.users.map(函数(用户)){
返回(
{user.name}
);
})}
);
}
});
导出默认应用程序;
我理解数据应该外推到Redux之类的东西中,但这只是处理动态数据的一个开始。我得到的错误是
Uncaught(in promise)TypeError:无法读取未定义的属性“map”
在做一些研究时,我找不到对此错误的很好解释。那么我做错了什么

我发现,如果我将数据预填充到
getInitialState
中,我可以得到一个返回。那么,将数据加载到初始状态的承诺出了什么问题

编辑: Console.log映像:


如果您看到控制台输出的结果。它不包含“关键用户”,因此

 _this.setState({
        users: results.data.users
      });
将状态用户设置为未定义,因此在尝试使用map时会出现
错误

将设置状态更改为

 _this.setState({
        users: results.data
      });

这是因为用户状态最初是空的,willmount方法在这里什么都没有做,所以它直接转到render方法,然后转到didmount,在render方法中,它试图用未定义的值映射用户状态,这导致了错误,我想你应该检查用户状态是否未定义。在“渲染方法”中直接选中它,或创建用于渲染贴图的函数。(假设方法名为renderUser),则可以将直接获取的方法设置为{this.renderUser()}

将设置状态更改为此

_this.setState({
    users: results.data
});

这一行的结果是什么
console.log(results.data)我得到了预期的数据返回。看起来数据没有被推入
getInitialState
中的用户数组中。您能显示
console.log(results.data)的输出吗?我为控制台输出添加了一个图像,这是
结果.data
结果.data.users
的输出吗?我很高兴编写一个有用的答案。