变更时的React FunctionComponent回调

Question

我正在尝试使用基于此示例的 Fluent UI PeoplePicker，用于 office outlook Add-In。FLUENT UI PeoplePicker其中使用了React中的FunctionComponent。我对React并不精通，但我知道回调在类中是如何工作的，但我不确定是否可以在Function Components中实现回调？

我有这样一个例子，PeoplePicker FunctionComponent在主App类中使用。我需要在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>);
};