我的Redux商店中存储了一个数据对象。但是,当我尝试导入PieChart组件的值时,这些值始终变得不确定。
import React, { Component } from 'react';
import { PieChart, Pie, Legend, ResponsiveContainer } from 'recharts';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
class PieCharts extends Component {
render () {
const {
user: {
credentials: Questions
}
} = this.props;
console.log(Questions);
this.Section1 = Questions[1];
this.Section2 = Questions[2] || 5000;
this.Section3 = Questions[3][1] || 0;
this.Section4 = Questions[3][2] || 0;
this.Section5 = Questions[3][3] || 0;
this.data1 = [
{name: 'Sec1', value: this.Section1},
{name: 'Sec2', value: this.Section2},
{name: 'Sec3', value: this.Section3},
{name: 'Sec4', value: this.Section4},
{name: 'Sec5', value: this.Section5},
];
return (
<React.Fragment>
<ResponsiveContainer width='100%' height='100%'>
<PieChart >
<Legend iconSize={10}
layout='horizontal'
verticalAlign='bottom'
// wrapperStyle={this.style}
/>
<Pie
data= {this.data1}
cx='50%'
cy='50%'
innerRadius='20%'
outerRadius="100%"
>
</Pie>
</PieChart>
</ResponsiveContainer>
</React.Fragment>
);
}
};
const mapStateToProps = (state) => ({
user: state.user
});
PieCharts.propTypes = {
user: PropTypes.object.isRequired
}
export default connect(mapStateToProps)(PieCharts);
但是我的console.log在控制台中显示了带有值(也有一些嵌套数组)的对象。密钥只是数字(1到5),是问题吗?