我的一个React组件有问题.我认为在React呈现ChildComp组件之前,AJAX不会从外部服务器加载所有内容.
在上面你可以看到来自服务器的响应树.这是我的组件代码:
var ChildComp = React.createClass({
getInitialState: function(){
return {
response: [{}]
}
},
componentWillReceiveProps: function(nextProps){
var self = this;
$.ajax({
type: 'GET',
url: '/subscription',
data: {
subscriptionId: nextProps.subscriptionId //1
},
success: function(data){
self.setState({
response: data
});
console.log(data);
}
});
},
render: function(){
var listSubscriptions = this.state.response.map(function(index){
return (
index.id
)
});
return (
<div>
{listSubscriptions}
</div>
)
}
});
Run Code Online (Sandbox Code Playgroud)
这工作正常,但如果我改变我的回报:
return (
index.id + " " + index.order.id
)
Run Code Online (Sandbox Code Playgroud)
id未定义.以及订单对象的所有其他属性.为什么会这样?如果我console.log在success功能后回复它会提供所有数据(如图片所示).我的猜测是,当React渲染组件时,只加载第一个对象,然后加载所有其他内部对象.我真的不能说是不是这样(听起来很奇怪),也不能说如何解决这个问题.
我也尝试过类似的东西
success: function(data){ …Run Code Online (Sandbox Code Playgroud)