feat: 新增点击 NodeLegend 的回调

antvis · Jun 30, 2022 · 66f2ae6 · 66f2ae6
1 parent c03ed7f
commit 66f2ae6
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 3 deletions.
diff --git a/packages/graphin/src/components/Legend/Node.tsx b/packages/graphin/src/components/Legend/Node.tsx
@@ -9,7 +9,7 @@ import type { LegendChildrenProps, OptionType } from './typing';
 const LegendNode: React.FunctionComponent<LegendChildrenProps> = props => {
   const { graph, theme } = React.useContext(GraphinContext);
 
-  const { options: defaultOptions, dataMap } = props;
+  const { options: defaultOptions, dataMap, onChange } = props;
 
   const { mode } = theme;
 
@@ -54,6 +54,8 @@ const LegendNode: React.FunctionComponent<LegendChildrenProps> = props => {
         graph.setItemState(edge, 'inactive', !checkedValue.checked);
       })
     });
+
+    onChange(checkedValue, result);
   };
 
   return (

diff --git a/packages/graphin/src/components/Legend/demos/index.tsx b/packages/graphin/src/components/Legend/demos/index.tsx
@@ -1,4 +1,4 @@
-import type { LegendChildrenProps } from '@antv/graphin';
+import type { LegendChildrenProps, OptionType } from '@antv/graphin';
 import Graphin, { Components, Utils } from '@antv/graphin';
 import iconsLoader from '@antv/graphin-icons';
 import * as React from 'react';
@@ -43,12 +43,16 @@ data.nodes.forEach((node, index) => {
 });
 
 const Demo = () => {
+  const onChange = (checkedValue: OptionType, options: OptionType[]) => {
+    console.log(checkedValue, options);
+  }
+
   return (
     <Graphin data={data}>
       <Legend bindType="node" sortKey="data.type">
         {(renderProps: LegendChildrenProps) => {
           console.log('renderProps', renderProps);
-          return <Legend.Node {...renderProps} />;
+          return <Legend.Node {...renderProps} onChange={onChange}/>;
         }}
       </Legend>
     </Graphin>

diff --git a/packages/graphin/src/components/Legend/typing.ts b/packages/graphin/src/components/Legend/typing.ts
@@ -34,4 +34,5 @@ export interface LegendChildrenProps {
   sortKey: string;
   dataMap: Map<string | number, any>;
   options: OptionType[];
+  onChange: (checkedValue: OptionType, result: OptionType[]) => void;
 }