React父子组件传值以及回调四种情况，类式向类式传递，类式向函数式传，函数式向函数式，函数式向类式编程传递。

最新推荐文章于 2025-05-08 13:25:12 发布

前端小云儿

最新推荐文章于 2025-05-08 13:25:12 发布

阅读量260

点赞数

分类专栏： React技能大全文章标签： react.js javascript 前端

本文链接：https://blog.csdn.net/jieweiwujie/article/details/143038541

版权

React技能大全专栏收录该内容

18 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

import React from "react"
export default class Home3 extends React.Component {
  state={
    fatherData:"法拉利"
  }
  //4 父组件接收值，并修改，然后子组件跟着修改
  FatherChange=(val)=>{
    this.setState({fatherData:val})
  }
  render(){
    return (<div style={
  {border:'2px solid blue'}}>
       <h3>类式向类式传递</h3>
       <h4>这是Home3</h4>
       {/* 3 父组件接收子组件对应的方法 */}
      <Home3Child 
      toChildCar={this.state.fatherData}  
      changeCarChildToFatherBack={this.FatherChange}/>
    </div>)
  }
}


class Home3Child extends React.Component {
  // 2子组件传值给父组件的方法，携带参数，注意箭头函数写法
  changeCar=()=>{
    this.props.changeCarChildToFatherBack('b

了解本专栏