reactjs - 在更改时响应 FunctionComponent 回调

Question

我正在尝试使用基于此示例的 Fluent UI PeoplePicker，用于 Office Outlook 插件： FLUENT UI PeoplePicker ，它在 React 中使用 FunctionComponent。我对 React 并不流利，但我仍然知道回调在类中是如何工作的，但我不确定是否可以在函数组件中实现回调？

我有这个在主 App 类中使用的 PeoplePicker FunctionComponent 示例。我需要在更改此 PeoplePicker 值时将数据传递回父级，但我不太清楚该怎么做。

主要问题是，如果可能的话，如何从 FunctionComponent 传回值？

Answer 1

这是具有功能组件的 Child -> Parent 回调结构的常规结构。

const Parent = () => {
  const handleOnChange = () => {
    console.log('This was called');
  };

  return(<Child onChange={handleOnChange} />);
};

const Child = (props) => {
  return(<button onClick={props.onChange}>Click here</button>);
};