zoukankan      html  css  js  c++  java
  • React 父组件调用子组件函数

    父组件代码

    import React, { Component,Fragment } from 'react'
    import TeamInfo from '../../component/TeamInfo'
    export default class Team extends Component {
      constructor (props){
        super(props)
        this.Child = React.createRef();   //// 创建一个ref去储存DOM子元素
        this.getTeamList = this.getTeamList.bind(this)
      }
      showTeamInfoView(){
        this.Child.current.show()   //调用子元素函数 show   (括号里可以传参)
      }
      render() {
        return (
          <Fragment>
            <Button type="primary" className='btn' onClick={()=>{this.showTeamInfoView()}} icon={<PlusOutlined />}>新增</Button>
            // ref 绑定子元素
            <TeamInfo  ref={this.Child}></TeamInfo>
          </Fragment>
        )
      }

    子组件代码

    import React,{Component,Fragment} from 'react'
    
    class TeamInfo extends Component{
    	constructor(props){
    		super(props)
    		this.show=this.show.bind(this)
    	}
    	show(){
          console.log("被父元素调用的函数")
    	}
    	render(){
    		return(
    			<Fragment>
    			</Fragment>
    		)
    	}
    
    }
    export default TeamInfo
    

      

  • 相关阅读:
    第一周作业
    C语言I博客作业08
    十四周助教总结
    十三周助教总结
    C语言I博客作业07
    C语言II博客作业01
    学期总结
    C语言I博客作业08(未完成)
    C语言I博客作业07
    C语言I博客作业06
  • 原文地址:https://www.cnblogs.com/banyuege/p/15112499.html
Copyright © 2011-2022 走看看