<ControlButton />

您可以透過使用 <ControlButton /> 組件，並將其作為子組件傳遞給 <Controls /> 組件，將按鈕新增至控制面板。

import { MagicWand } from '@radix-ui/react-icons'
import { ReactFlow,  Controls, ControlButton } from '@xyflow/react'
 
export default function Flow() {
  return (
    <ReactFlow nodes={[...]} edges={[...]}>
      <Controls>
        <ControlButton onClick={() => alert('Something magical just happened. ✨')}>
          <MagicWand />
        </ControlButton>
      </Controls>
    </ReactFlow>
  )
}

屬性

<ControlButton /> 組件接受 HTML <button /> 元素上有效的任何屬性。

組件類型