标题：使用React ref在父组件中调用子组件的函数式组件函数
在React开发中，我们经常会遇到需要在父组件中调用子组件的函数的情况。尤其是在子组件是函数式组件的情况下，这个问题就显得更加棘手。不过，幸运的是，React提供了一种简洁而高效的方式来解决这个问题——使用ref。在本文中，我们将深入探讨如何使用ref在父组件中调用子组件的函数式组件函数。
一、使用React ref
在React中，ref是一种特殊的属性，可用于引用React元素或组件实例。通过ref，我们可以直接访问被引用的元素或组件，从而可以在父组件中对子组件进行操作。在类组件中，我们可以通过创建ref对象，并将其赋值给子组件的ref属性来使用ref。而在函数式组件中，则可以通过useRef hook来创建ref。
1. 在类组件中使用ref
在类组件中使用ref很简单，我们只需要使用ateRef()来创建ref对象，然后将其赋值给子组件的ref属性即可。
```jsx
class ChildComponent extends React.Component {
  doSomething(){
react面试题ref概念    //do something
  }
  render(){
    return (
      <div>子组件内容</div>
    )
  }
}
class ParentComponent extends React.Component {
  constructor(props){
    super(props);
    this.childRef = ateRef();
  }
  handleClick(){
    this.childRef.current.doSomething();
  }
  render(){
    return (
      <div>
        <ChildComponent ref={this.childRef} />
        <button onClick={this.handleClick.bind(this)}>调用子组件函数</button>
      </div>
    )
  }
}
```
在上面的例子中，我们创建了一个ChildComponent类组件，并在父组件中使用ateRef()来创建了一个ref对象childRef，并将其赋值给了子组件的ref属性。然后在父组件的handleClick方法中，我们通过this.childRef.current访问子组件的实例，并调用其doSomething方法。
2. 在函数式组件中使用ref
在函数式组件中使用ref同样也很简单，我们可以通过useRef hook来创建ref对象，并将其赋值给子组件的ref属性。
```jsx
function ChildComponent(){
  const doSomething = () => {
    //do something
  }
  return (
    <div>子组件内容</div>
  )
}
function ParentComponent(){
  const childRef = useRef();
  const handleClick = () => {
    childRef.current.doSomething();
  }
  return (
    <div>
      <ChildComponent ref={childRef} />
      <button onClick={handleClick}>调用子组件函数</button>
    </div>
  )
}
```
在上面的例子中，我们创建了一个ChildComponent函数式组件，并在父组件中使用useRef来创建了一个ref对象childRef，并将其赋值给了子组件的ref属性。然后在父组件中的handleClick方法中，我们通过childRef.current访问子组件的实例，并调用其doSomething方法。