react 中组件传值

在 React 中，组件之间可以通过属性（props）来进行传值。父组件可以通过在子组件上设置属性的方式将数据传递给子组件。

在父组件中，你可以在子组件的使用中为其设置属性。例如：

function ParentComponent() {
  const data = "Hello, child component!"; // 数据

  return (
    <ChildComponent message={data} />
  );
}

在子组件中，你可以通过 `props` 对象来访问父组件传递的属性。例如：

function ChildComponent(props) {
  return <div>{props.message}</div>;
}

在上述示例中，父组件 `ParentComponent` 将 `data` 数据通过 `message` 属性传递给子组件 `ChildComponent`，子组件通过 `props.message` 来获取这个值并进行使用。

另外，如果需要在子组件中修改父组件传递的数据，你可以通过回调函数的方式将修改后的值传递回父组件。父组件可以将一个函数作为属性传递给子组件，子组件在需要修改数据时调用该函数。这样父组件就能够得到修改后的值并进行更新。

这是 React 中最基本和常见的一种组件之间传值的方式，当然还有其他高级的传值方式，例如使用 Context 或 Redux 进行状态管理。但以上的方式已经足够满足大多数场景下的传值需求了。