feat:新增react-flow:panOnScroll,和preventScrolling属性

Author: 昔梦

docs/xflow/api.md

@@ -27,6 +27,10 @@ group:
 | onMenuItemClick | 点击节点右上角复制粘贴删除功能， 支持自定义和默认行为 | (itemInfo: [ItemInfo](#iteminfo), defaultAction: () => void) => void | - |
 | clickAddNode | 自定义添加节点逻辑 | `(type: string, nodeItem: TNodeItem, addNode: (initData?: Record<string,any>) => void) => void` | - |
 | zoomOnScroll      | 是否通过滚动鼠标滚轮来缩放画布                           | `boolean`                                                                                   | `true` |
+| panOnScroll      | 是否通过滚动鼠标滚轮来平移画布                           | `boolean`                                                                                   | `false` |
+| preventScrolling      |   是否阻止浏览器在画布上滚动时的默认行为                         | `boolean`                                                                                   | `true` |
+
+
 
 
 ## TNodePanel

packages/x-flow/src/XFlow.tsx

@@ -87,7 +87,7 @@ const XFlow: FC<FlowProps> = memo(props => {
   const { settingMap, globalConfig, readOnly } = useContext(ConfigContext);
   const [openPanel, setOpenPanel] = useState<boolean>(true);
   const [openLogPanel, setOpenLogPanel] = useState<boolean>(true);
-  const { onNodeClick, zoomOnScroll=true } = props;
+  const { onNodeClick, zoomOnScroll = true, panOnScroll = false, preventScrolling = true } = props;
   const nodeEditorRef = useRef(null);
 
   useEffect(() => {
@@ -308,6 +308,9 @@ const XFlow: FC<FlowProps> = memo(props => {
         edges={edges}
         minZoom={0.3}
         zoomOnScroll={zoomOnScroll}
+        panOnScroll={panOnScroll}   // 禁用滚动平移
+        preventScrolling={preventScrolling}    // 允许页面滚动
+
         defaultEdgeOptions={{
           type: 'buttonedge',
           style: {

packages/x-flow/src/types.ts

@@ -159,6 +159,8 @@ export interface FlowProps {
   onMenuItemClick?: (itemInfo: ItemInfo, defaultAction: () => void) => void;
   clickAddNode?: (type: string, nodeItem: TNodeItem, addNode: (initData?: Record<string, any>) => void) => void;
   zoomOnScroll?: boolean;
+  panOnScroll?: boolean;
+  preventScrolling?: boolean;
 }
 interface ItemInfo {
   key: 'copy' | 'paste' | 'delete' | string;