antd react传值（子传父）

最新推荐文章于 2024-02-28 11:10:50 发布

咸鱼妹妹

最新推荐文章于 2024-02-28 11:10:50 发布

阅读量786

点赞数

分类专栏： react

本文链接：https://blog.csdn.net/weixin_45884202/article/details/116485818

版权

react 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

本文介绍了一种在React中实现子组件向父组件传递事件的方法。通过设置回调函数，子组件能够抛出事件，父组件则通过绑定的回调函数接收到这些事件并更新状态，实现了父子组件间的通信。示例代码详细展示了这一过程。

摘要由CSDN通过智能技术生成

子组件向外抛出一个事件，父组件接收一下事件

子组件  --->   父组件
// tab头部
callback =(key) =>{
      let { childClick } = this.props;
      console.log(key,'tab')
      
      childClick('','', key)
      this.setState({
          key:key
      },() => {
          console.log(this.state.key,'-----key')
      })
  }

父组件接收值
{/* 下拉菜单 */}
  <RightNav
      childClick={this.handleRightNavId.bind(this)}
  >
  </RightNav>

  handleRightNavId(id,key,keying) {
        console.log('子传父值')
        console.log('id', id)
        console.log('key',key)
        console.log('king', keying)
        console.log('子传父值')
        this.setState({
            RightNavId: id,     //id值
            RightNavKey: key,   //key值
            RightNavKeying: keying,
        })
    }