Reactjs React.js：我可以’；t通过父组件为两个子组件之间的交换编写回调

我有三个组件：应用程序（父组件）和两个子组件（游戏、游戏）。在游戏的子组件中有一个函数，为随机div分配一个绿色。我需要通过父组件传输此函数，并连接到第二个子组件（Play）的Play按钮

App（父组件）
从“React”导入React，{Component}；
从“./components/Game/Game”导入游戏；
从“./components/Play/Play”导入播放；
导出默认类应用程序扩展组件{
状态={
sizeEasyMode:未定义，
sizeNormalMode:未定义，
sizeHardMode:未定义，
delayTimeEasyMode:未定义，
delayTimeNormalMode:未定义，
delayTimeHardMode:未定义，
电话：20，
}
异步组件didmount（）{
常数响应=等待
fetch（URL）//数据形成大小div（高度和宽度）
const gameSettings=wait response.json（）；
这是我的国家({
//Div大小（高度和宽度）由URL形成
})
}
cellColor=（）=>{//我尝试编写回调
this.setState（{number:24}）
}
渲染（）{
返回(
玩
<游戏
cellColor={this.cellColor}
x={this.state.x}
/>
)
}
}
游戏（子组件）
从“React”导入React，{Component}；
导出默认类游戏扩展组件{
render（）{
const duel=['duel1'，'duel2'，'duel3'，'duel4'，'duel5'，'duel6'，'duel7'，
“决斗8”、“决斗9”、“决斗10”、“决斗11”、“决斗12”、“决斗13”、“决斗14”，
‘决斗15’、‘决斗16’、‘决斗17’、‘决斗18’、‘决斗19’、‘决斗20’、‘决斗21’，
“决斗22”、“决斗23”、“决斗24”、“决斗25”]；
//此功能需要连接到游戏的子组件
让numRandom=（）=>{
让randomNumber=duel[Math.round（Math.random（）*this.props.cellColor+1）]；
让rancellGreen=document.getElementById（随机数）.style.backgroundColor='green'
}
返回(
{
this.props.cellColor（）；
}}>
);
}
}
播放（子组件）
从“React”导入React，{Component}；
导出默认类播放扩展组件{
render（）{
返回(
玩
);
}
}

不太清楚您到底想要实现什么。是否要触发兄弟组件

Play

中的

Game

中定义的函数？我不确定这是否可能。。。这也不是一个好的设计选择。如果您发现自己希望子组件相互通信，那么应该将公共信息放在父组件中

像这样的小片段也许

函数应用程序（）{
const[num，setNum]=React.useState（）
函数播放（）{
setNum（Math.floor（5*Math.random（）））
}
返回
}
功能游戏（道具）{
const divArr=[0,1,2,3,4]
返回(
{divArr.map（（arr，i）=>）}
)
}
功能扮演（道具）{
回击
}
ReactDOM.render（，document.getElementById（'root'））

.square{
显示：内联块；
保证金：1px；
高度：20px；
宽度：20px；
背景颜色：橙色；
}
格林先生{
背景颜色：绿色；
}

---

将状态提升到更高的位置，然后将其作为道具传递给孩子们。

---

如果您需要子组件负责操作“何时”发生，那么您可以将函数作为道具传递（fetchGameData），然后让父组件管理状态并将其作为道具传递。

一切都解决了。话题结束了。我将根div从“Game”组件移动到了“App”。因此，功能“numRandom”已移至“App”。我想向real React.js教授表示深深的感谢，他们提出了解决问题的方法。

也许你的问题出在

{this.props.cellColor}

cellColor是一个函数，你没有执行它。试试这个

两个选项都不起作用。谢谢你提出的解决方案，但根据我的经验，这个选项很难，尽管我很理解你想说的话。我想使用number参数通过cellColor callbask将numRandom函数提升到父组件，并通过props将numRandom连接到Play组件中的按钮。谢谢你的帮助。我明白我的主要错误。通过回调，我无法将此函数提升到父组件，我将重做应用程序的整个体系结构。