Javascript 数组[index]返回未定义，而数组本身显示每个索引
我正在尝试为我的延迟加载项获取一些单独的图表（图形）数据。为此，首先我获取项目（每个延迟加载10个），然后我组合这些项目的名称并将其（组合名称字符串）发送给另一个API方法，并获取这10个项目的图表数据。在我把我的图表组件（这是一个apexcharts组件）放入页面之前，一切似乎都很好。当我尝试这样做时，它总是抱怨series标记（属性）未定义，因此无法获得未定义的[0]索引 为了实现这一点，我首先尝试通过在代码中放置console.log条目来查看是否一切正常，并相应地进行了分配。在我看到一切正常之后，我放置了图表组件代码，但不管我做什么，它总是说series属性未定义。基本上，我尝试做的所有事情都在第一个Javascript 数组[index]返回未定义，而数组本身显示每个索引,javascript,arrays,reactjs,apexcharts,Javascript,Arrays,Reactjs,Apexcharts,我正在尝试为我的延迟加载项获取一些单独的图表（图形）数据。为此，首先我获取项目（每个延迟加载10个），然后我组合这些项目的名称并将其（组合名称字符串）发送给另一个API方法，并获取这10个项目的图表数据。在我把我的图表组件（这是一个apexcharts组件）放入页面之前，一切似乎都很好。当我尝试这样做时，它总是抱怨series标记（属性）未定义，因此无法获得未定义的[0]索引 为了实现这一点，我首先尝试通过在代码中放置console.log条目来查看是否一切正常，并相应地进行了分配。在我看到一切
Promise.all（）构造函数（道具）{
超级（道具）；
this.trendSeries=[]；
}
其他事项（）{
让自我=这个；
Promise.all（[this.getPopularMatters（）、this.getResourceStatistics（）、this.getPopularSeries（）]）。然后（函数（结果）{
let items=（self.state.matters==null？[]：self.state.matters）；
让pageIndex=self.state.pageIndex；
items=items.concat（结果[0]）；
pageIndex++；
自我状态({
事项：项目、统计数据来源：结果[1]，
});
}).最后（函数（）{
///准备用逗号连接的名称以获取单个图表数据
让namesArray=[]；
self.state.matters.map（（项目、索引）=>{
namesArray.push（item.name）；
});
常量名称=namesArray.join（）；
设seriesArray=[]；
让items=self.state.matters；
///获取单个图表数据
Promise.all（[self.getIndividualChartsFormeters（name）]）。然后（function（res）{
res[0]。地图（（项目，索引）=>{
items[index][“series”]=item.series；//将序列数据放入每个项的series属性中。
序列排列推送（项目系列）；
});
}).最后（函数（）{
日志（“序列阵列：”，序列阵列）；
log（“序列数组索引：”，序列数组[0]）；
log（“结果2系列：”，self.state.chartSeries）；
log（“R2类型：”，typeof（self.state.chartSeries））；
log（“索引r2:，self.state.chartSeries[0]）；
self.trendSeries=序列数组；
self.setState（{individualChartSeries:seriesArray}）；
log（“系列状态：”，self.STATE.individualChartSeries）；
log（“系列状态索引：”，self.STATE.individualChartSeries[0]）；
日志（“趋势系列：”，self.trendSeries）；
console.log（“趋势系列索引：”，self.trendSeries[0]）；
});
});
}
render（）{
var项目=[]；
这个州很重要&&
this.state.matters.map（（项目，索引）=>(
推(
{item.order}
{item.name}
{///此处将显示个人趋势图
}
);
返回(
{items.length>0？
项目
:
这里没有趋势显示。。。
}
);
}
购买力平价
SSS
三,
现在，当我将上述任何图表组件放入//INDIVIDUAL Chart WILL HERE部分时，我得到一个错误，即“TypeError:无法读取undefined的属性“0”或“无法读取undefined的属性“length”。这最终表示图表组件的series属性未定义。但是，正如console.log日志所示正确获取序列数据（所有格式-trendSeries属性（字段）、状态变量或注入项数组）。
我错过了什么或做错了什么？
constructor(props) {
super(props);
this.trendSeries = [];
}
loadMatters() {
let self = this;
Promise.all([ this.getPopularMatters(), this.getResourceStatistics(), this.getPopularSeries()]).then(function (results) {
let items = (self.state.matters === null ? [] : self.state.matters);
let pageIndex = self.state.pageIndex;
items = items.concat(results[0]);
pageIndex++;
self.setState({
matters: items, statisticsByResources: results[1],
});
}).finally(function () {
/// Prepare the names joined by comma to get individual chart data
let namesArray = [];
self.state.matters.map((item, index) => {
namesArray.push(item.name);
});
const names = namesArray.join();
let seriesArray = [];
let items = self.state.matters;
/// GET INDIVIDUAL CHART DATA
Promise.all([self.getIndividualChartsForMatters(names)]).then(function (res) {
res[0].map((item, index) => {
items[index]["series"] = item.series; //put the series data into series property of each item.
seriesArray.push(item.series);
});
}).finally(function () {
console.log("seriesArray :", seriesArray);
console.log("seriesArray INDEX:", seriesArray[0]);
console.log("results 2 series : ", self.state.chartSeries);
console.log("R2 type : ", typeof (self.state.chartSeries));
console.log("index r2 : ", self.state.chartSeries[0]);
self.trendSeries = seriesArray;
self.setState({ individualChartSeries: seriesArray });
console.log("series STATE : ", self.state.individualChartSeries);
console.log("series STATE INDEX : ", self.state.individualChartSeries[0]);
console.log("trendSeries : ", self.trendSeries);
console.log("trendSeries INDEX : ", self.trendSeries[0]);
});
});
}
render() {
var items = [];
this.state.matters &&
this.state.matters.map((item, index) => (
items.push(
<div key={index} className="bg-color-mid-blue border-rad-8px mb-2_0em">
<div >
<div className="font-2_9em font-regular text-center line-height-1_1em pr-0_5em color-dark-gray">{item.order}</div>
<div>
<span className="d-block font-1_3em mbt-0_25em font-medium white-space-nowrap">{item.name}</span>
</div>
<div>
{ /// INDIVIDUAL TREND CHART WILL BE HERE
}
</div>
</div>
</div>);
return(
<InfiniteScroll
loadMore={this.loadMatters}
hasMore={this.state.hasMore && !this.state.isLoading}
loader={<div className="w-100per text-center pt-2_0em pb-2_0em" key={0}>Loading...</div>}>
{items.length > 0 ?
items
:
<div className="row">
<div className="col-xl-12 mb-2_0em">
<div className="bg-color-mid-blue p-2_0em border-rad-8px mb-2_0em color-mid-gray">
No trends to show here...
</div></div></div>}
</InfiniteScroll>);
}
PPP
<Chart
options={this.state.chartOptions}
series={this.trendSeries[index]}
type="line"
height="150px"
/>
SSS
<Chart
options={this.state.chartOptions}
series={this.state.individualChartSeries[index]}
type="line"
height="150px"
/>
III
<Chart
options={this.state.chartOptions}
series={item.series}
type="line"
height="150px"
/>
now when I put any of the above Chart components in the //INDIVIDUAL CHART WILL BE HERE part, I get an error saying that either 'TypeError: Cannot read property '0' of undefined' or 'Cannot read the property 'length' of undefined'. Which ultimately denotes that series attribute of the Chart component is undefined. But as the console.log logs clearly show, the series data (in all formats -trendSeries attribute (field), state variable, or injected into items array- )is correctly obtained.
What am I missing or doing wrong?