zoukankan      html  css  js  c++  java
  • react typescript 子组件调用父组件

    //父组件

    import * as React from 'react'
    import { Input } from 'antd'
    const Search = Input.Search
    import "./index.less"
    import Child from "./compon/list"
    interface IProps {

    MakeMoney?: () => void //暴露方法
    }
    export default class ProjectList extends React.Component<IProps>{
    constructor(props: IProps) {
    super(props)

    }
    MakeMoney(){  //子组件调用父组件的方法
    alert("我在学习react!");
    }
    render(){
    return (
    <div>
    <div className="Input_box">
    <div style={{ marginBottom: 16 }}>
    <Search
    placeholder="搜索"
    onSearch={value => console.log(value)}
    onChange={this.Inpchange}
    enterButton
    />
    <button>点击切换</button>
    </div>
    </div>
    <Child MakeMoney={this.MakeMoney}/>//子组件
    </div>
    )
    }
    }
    //子组件
    import * as React from 'react'
    import { Row, Col } from 'antd';
    import "./list.less"
    interface IProps {
    msg?: any
    MakeMoney?:any  //获取暴露的方法
    }
    interface IState {
    lg?: any

    }
    export default class List extends React.Component<IProps, IState> {
    constructor(props: IProps) {
    super(props)

    }
    StudyMakeMoney=()=>{ // 调用父组件方法
    this.props.MakeMoney();
    }
    render(){
    const { lg } = this.state;
    return (
    <div>
    <button onClick={this.StudyMakeMoney}>子组件</button>
      </div>

    }
  • 相关阅读:
    BZOJ 1576 树剖+LCT
    CF1051D Bicolorings 递推
    CF938D Buy a Ticket dijkstra
    记一次创建svc代理失败
    K8S中Service
    K8S中的Job和CronJob
    K8S中DaemonSet
    Linux expect介绍和用法
    Java根据余弦定理计算文本相似度
    Python和Sublime的整合
  • 原文地址:https://www.cnblogs.com/whlBooK/p/10811395.html
Copyright © 2011-2022 走看看