fix: 默认选中变化时不更新 (#1408)

packages/f2/src/components/geometry/index.tsx

@@ -54,6 +54,7 @@ class Geometry<
   }
 
   willReceiveProps(nextProps) {
+    super.willReceiveProps(nextProps);
     const { props: lastProps, attrController } = this;
     const { data: nextData, adjust: nextAdjust, zoomRange: nextZoomRange } = nextProps;
     const { data: lastData, adjust: lastAdjust, zoomRange: lastZoomRange } = lastProps;

packages/f2/src/components/geometry/selection.ts

@@ -1,6 +1,7 @@
 import { isFunction } from '@antv/util';
 import Component from '../../base/component';
 import { ShapeAttrs, Point } from '../../types';
+import equal from '../../base/equal';
 
 function isEqual(origin1, origin2, fields: string[]) {
   if (origin1 === origin2) {
@@ -117,6 +118,19 @@ class Selection<
     });
   }
 
+  willReceiveProps(nextProps: P): void {
+    const { selection: nextSelection } = nextProps;
+    const { selection: lastSelection } = this.props;
+    if (!nextSelection || !lastSelection) {
+      return;
+    }
+    const { defaultSelected: nextDefaultSelected } = nextSelection;
+    const { defaultSelected: lastDefaultSelected } = lastSelection;
+    if (!equal(nextDefaultSelected, lastDefaultSelected)) {
+      this.state.selected = nextDefaultSelected;
+    }
+  }
+
   getSnapRecords(_point: Point) {
     return null;
   }

packages/f2/test/components/interval/selected.test.tsx

@@ -324,3 +324,55 @@ describe('cancelable = false', () => {
     expect(context).toMatchImageSnapshot();
   });
 });
+
+describe('改变默认值', () => {
+  it('改变默认值', async () => {
+    const context = createContext();
+
+    const getProps = (data, defaultSelected) => {
+      const { props } = (
+        <Canvas context={context} pixelRatio={1} animate={false}>
+          <Chart
+            data={data}
+            coord={{
+              radius: 0.8,
+              type: 'polar',
+              transposed: true,
+            }}
+          >
+            <Interval
+              x="a"
+              y="sold"
+              adjust="stack"
+              color="genre"
+              selection={{
+                defaultSelected,
+                selectedStyle: (record) => {
+                  const { yMax } = record;
+                  return {
+                    r: yMax * 1.1,
+                  };
+                },
+                cancelable: false,
+              }}
+            />
+          </Chart>
+        </Canvas>
+      );
+      return props;
+    };
+
+    const props = getProps(data, [{ a: '1', genre: 'Sports', sold: 275 }]);
+    const canvas = new Canvas(props);
+    canvas.render();
+
+    await delay(200);
+    expect(context).toMatchImageSnapshot();
+
+    const updateProps = getProps([].concat(data), [{ a: '1', genre: 'Strategy', sold: 115 }]);
+    canvas.update(updateProps);
+
+    await delay(200);
+    expect(context).toMatchImageSnapshot();
+  });
+});