Function 帶有功能組件的道具 - 不是 function（React + Typescript）

Question

我有一個帶有 function 道具的功能組件不起作用。 所以...

export interface IPanelProps {
  itemID; number;
  Open: boolean;
  onClose: () => void;
}


const FabricPanel: FC<IPanelProps> = ({ onClose, Open, itemID }) => {
  let _OnCancelClick = () => {
    onClose();
  }

  return (
    <Panel isOpen={Open}>
      <h2>{itemID} </h2>
      <DialogFooter>
        <DefaultButton text="Cancel" onClick={_OnCancelClick} />
        <PrimaryButton text="Save" />
      </DialogFooter>
    </Panel>
  )
}

收到錯誤：未捕獲的類型錯誤：onClose 不是 function 打開和項目 ID 道具工作正常，是因為我正在調用 function 道具嗎？ 我試圖代替（道具），但這沒有用。

有什么想法嗎？

在父組件上：

   _renderPanelComponent = (props: any) => {
    const element : React.ReactElement<IPanelProps> = React.createElement(FabricPanel, assign({
      itemID : null,
      Open : false,
      OnClose : null


    }, props))
    ReactDom.render(element, this.panelPlaceHolder);
  }

  _showPanel = (itemID : number) => {
    this._renderPanelComponent({
      itemID,
      Open : true,
      OnClose : this._dismissPanel


    })
  }

  _dismissPanel = () =>{        
    this._renderPanelComponent({ isOpen: false });   
 }

當按下 SharePoint 上的按鈕時，將執行箭頭 function 顯示面板，這工作正常。 但 onClose 不起作用。

Answer 1

OnClose 在功能組件和父組件之間拼寫不同。 所以兩者都拼寫為 onClose - 排序！