reactjs - 如何在不导航到子组件的情况下发送值

Question

早上好

我想向子组件发送一些数组数据，这个组件的目的是让我在一页中的代码更短

这个页面我命名为主页，主页里面有多个图表

import Chart01 from ../components/chart01
import Chart02 from ../components/chart02
import Chart03 from ../components/chart03

在这个主页上会有一些按钮(我打算)向这 3 个图表发送值

const [FirstValue,setFirstValue] = useState(0)

return(
<View>
  <View>
     <Button onPress={()=>setFirstValue(1)}
     <Button onPress={()=>setFirstValue(2)}
     <Button onPress={()=>setFirstValue(3)}
  </View>
  <Chart01/>
  <Chart02/>
  <Chart03/>
</View>
)

如何将 FirstValue 从 HomePage 发送到 Chart01 Chart02 Chart03？

在 Chart01 中，如何调用从 HomePage 发送的值？

谢谢

Answer 1

在家里你有像下面这样的传球，

<Chart01 value={FirstValue}/>
<Chart02 value={FirstValue}/>
<Chart03 value={FirstValue}/>

在 Chart01,02,03 定义中，你必须阅读 props。

const Chart01 = (props) => {
  const { value } = props;
  // someting
};