react hooks子传父

React Hooks 是 React 16.8 版本引入的一个特性，它可以让你在无需编写类组件的情况下使用状态和其他 React 特性。在 React 中，数据是自上而下流动的，也就是父组件可以通过 props 将数据传递给子组件。但是，如果子组件需要将数据传递给父组件，就需要使用回调函数来实现。

下面是一个示例，展示了如何在 React Hooks 中实现子组件向父组件传递数据：

import React, { useState } from 'react';

function ParentComponent() {
  const [dataFromChild, setDataFromChild] = useState('');

  const handleDataFromChild = (data) => {
    setDataFromChild(data);
  };

  return (
    <div>
      <ChildComponent sendDataToParent={handleDataFromChild} />
      <p>Data from child: {dataFromChild}</p>
    </div>
  );
}

function ChildComponent({ sendDataToParent }) {
  const handleClick = () => {
    const data = 'Hello from child!';
    sendDataToParent(data);
  };

  return (
    <button onClick={handleClick}>Send data to parent</button>
  );
}

在上面的例子中，ParentComponent 是父组件，ChildComponent 是子组件。父组件中有一个状态变量 `dataFromChild`，并通过 `setDataFromChild` 函数来更新它。父组件将 `handleDataFromChild` 函数通过 props 传递给子组件。

子组件中有一个按钮，当点击按钮时，会调用 `handleClick` 函数，并将数据 `'Hello from child!'` 通过 `sendDataToParent` 回调函数传递给父组件。

这样，子组件就可以将数据传递给父组件了。父组件接收到子组件传递的数据后，可以在界面上展示或做其他处理。