// 父组件 import React from 'react' import Son from './son' import { Button } from 'antd' class Father extends React.Component { child: any constructor(props) { super(props) } sonRef = (ref) => { this.child = ref // 在这里拿到子组件的实例 } clearSonInput = () => { this.child.clearInput() } render() { return ( <div> <Son onRef={this.sonRef} /> <Button type='primary' onClick={this.clearSonInput}> 清空子组件的input </Button> </div> ) } } export default Father // 子组件 import React from 'react' import { Button } from 'antd' interface IProps { onRef: any } class Son extends React.Component<IProps> { constructor(props) { super(props) } componentDidMount() { this.props.onRef(this) // 在这将子组件的实例传递给父组件this.props.onRef()方法 } state = { info: 'son', } handleChange = (e) => { this.setState({ info: e.target.value, }) } clearInput = () => { this.setState({ info: '', }) } render() { return ( <div> <div>{this.state.info}</div> <input type='text' onChange={this.handleChange} /> </div> ) } } export default Son