Javascript 如何在react中添加setState

我正在尝试制作一个动态饼图，当滑块移动时，动态饼图的值也会发生变化，我制作了组件并对其进行了渲染，但我无法介绍setState，因为这两个组件无法通信，该怎么办，请建议，我的代码如下：

动态饼图
类图表扩展了React.Component{
render（）{
var PieChart=rd3.PieChart；
var pieData=[{label:“First”，value:50}，{label:“Second”，value:50}]；
返回(
)}
}
图表类型={
pieData:React.PropTypes.arrayOf（React.PropTypes.shape({
标签：React.PropTypes.string.isRequired，
值：React.PropTypes.number.isRequired}.isRequired
}
类滑块扩展了React.Component{
render（）{
返回（）；
}
}
类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
数据：[
{标签：“第一”，值：50}，{标签：“第二”，值：50}
]
};  
}
扶手滑道（e）{
var切片1=（360*e.target.value）/100；
var slices2=360-slices1；
变量数组1=[
{label:“First”，值：slices1}，
{标签：“第二”，值：slices2}
];
this.setState（{pieData:array1}）；
}
render（）{
返回(
);
}
}
ReactDOM.render（，document.getElementById（'container'））；

您需要将道具传递给图表组件

动态饼图
类图表扩展了React.Component{
render（）{
var PieChart=rd3.PieChart；
var pieData
如果（！this.props.pieData）
pieData=[{label:“First”，value:50}，{label:“Second”，value:50}]；
其他的
pieData=this.props.pieData
返回(
)}
}
图表类型={
pieData:React.PropTypes.arrayOf（React.PropTypes.shape({
标签：React.PropTypes.string.isRequired，
值：React.PropTypes.number.isRequired}.isRequired
}
类滑块扩展了React.Component{
render（）{
返回（）；
}
}
类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
数据：[
{标签：“第一”，值：50}，{标签：“第二”，值：50}
]
};  
}
扶手滑道（e）{
var切片1=（360*e.target.value）/100；
var slices2=360-slices1；
变量数组1=[
{label:“First”，值：slices1}，
{标签：“第二”，值：slices2}
];
this.setState（函数（prevState）{
返回{pieData:array1}
});
}
render（）{
返回(
);
}
}
ReactDOM.render（，document.getElementById（'container'））；

您需要将道具传递给图表组件

动态饼图
类图表扩展了React.Component{
render（）{
var PieChart=rd3.PieChart；
var pieData
如果（！this.props.pieData）
pieData=[{label:“First”，value:50}，{label:“Second”，value:50}]；
其他的
pieData=this.props.pieData
返回(
)}
}
图表类型={
pieData:React.PropTypes.arrayOf（React.PropTypes.shape({
标签：React.PropTypes.string.isRequired，
值：React.PropTypes.number.isRequired}.isRequired
}
类滑块扩展了React.Component{
render（）{
返回（）；
}
}
类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
数据：[
{标签：“第一”，值：50}，{标签：“第二”，值：50}
]
};  
}
扶手滑道（e）{
var切片1=（360*e.target.value）/100；
var slices2=360-slices1；
变量数组1=[
{label:“First”，值：slices1}，
{标签：“第二”，值：slices2}
];
this.setState（函数（prevState）{
返回{pieData:array1}
});
}
render（）{
返回(
);
}
}
ReactDOM.render（，document.getElementById（'container'））；

我自己解决了这个问题，我的解决方法如下：

动态饼图
动态饼图
类图表扩展了React.Component{
render（）{
var PieChart=rd3.PieChart；
var pieData=[{label:“First”，value:50}，{label:“Second”，value:50}]；
返回(
)}
}
图表类型={
pieData:React.PropTypes.arrayOf（React.PropTypes.shape({
标签：React.PropTypes.string.isRequired，
值：React.PropTypes.number.isRequired}.isRequired
}	
类滑块扩展了React.Component{
render（）{
返回（）；
}
}
类应用程序扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
pieData:[{label:“First”，value:50}，{label:“Second”，value:50}]
};  
}
扶手滑道（e）{
var slices1=（100*e.target.value）/100；
var slices2=100-slices1；
变量数组1=[
{label:“First”，值：slices1}，
{标签：“第二”，值：slices2}
];
this.setState（{pieData:array1}）；
log（'slice 1:'+slices1）；
log（'slice 2:'+slices2）
}
render（）{
返回(
);
}
}
ReactDOM.render（，document.getElementById（'container'））；

我自己解决了这个问题，我的解决方法如下：

动态饼图
动态饼图
类图表扩展了React.Component{
render（）{
var PieChart=rd3.PieChart；
var pieData=[{label:“First”，value:50}，{label:“Second”，value:50}]；
返回(
)}
}
图表类型={
pieData:React.PropTypes.arrayOf（React.PropTypes.shape({
标签：React.PropTypes.string.isRequired，
值：React.PropTypes.number.isRequired}.isRequired
}	
类滑块扩展了React.Component{
render（）{