参考组件

<ControlButton />

GitHub 上的源代码

你可以使用 <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 /> 元素的所有有效属性。