EdgeProps
当你实现自定义边时,它会被包裹在一个组件中,该组件提供了一些基本功能。你的自定义边组件会收到以下 props
export type EdgeProps<EdgeType extends Edge = Edge> = {
id: string;
animated: boolean;
data: EdgeType['data'];
style: React.CSSProperties;
selected: boolean;
source: string;
target: string;
sourceHandleId?: string | null;
targetHandleId?: string | null;
interactionWidth: number;
sourceX: number;
sourceY: number;
targetX: number;
targetY: number;
sourcePosition: Position;
targetPosition: Position;
label?: string | React.ReactNode;
labelStyle?: React.CSSProperties;
labelShowBg?: boolean;
labelBgStyle?: CSSProperties;
labelBgPadding?: [number, number];
labelBgBorderRadius?: number;
markerStart?: string;
markerEnd?: string;
pathOptions?: any;
};
字段
名称 | 类型 |
---|---|
# id | string |
# animated? | boolean |
# data | T |
# style | React.CSSProperties |
# selected | boolean |
# source | string |
# target | string |
# sourceHandleId? | string | null |
# targetHandleId? | string | null |
# interactionWidth | number |
# sourceX | number |
# sourceY | number |
# targetX | number |
# targetY | number |
# sourcePosition | Position |
# targetPosition | Position |
# label? | string | React.ReactNode |
# labelStyle? | React.CSSProperties |
# labelShowBg? | boolean |
# labelBgStyle? | React.CSSProperties |
# labelBgPadding? | [number, number] |
# labelBgBorderRadius? | number |
# markerStart? | string |
# markerEnd? | string |
# pathOptions? | 任何类型 |