perf: update align

components/vc-align/Align.tsx

@@ -8,6 +8,7 @@ import isVisible from '../vc-util/Dom/isVisible';
 import { isSamePoint, restoreFocus, monitorResize } from './util';
 import type { AlignType, AlignResult, TargetType, TargetPoint } from './interface';
 import useBuffer from './hooks/useBuffer';
+import isEqual from 'lodash-es/isEqual';
 
 type OnAlign = (source: HTMLElement, result: AlignResult) => void;
 
@@ -53,11 +54,12 @@ export default defineComponent({
   props: alignProps,
   emits: ['align'],
   setup(props, { expose, slots }) {
-    const cacheRef = ref<{ element?: HTMLElement; point?: TargetPoint }>({});
+    const cacheRef = ref<{ element?: HTMLElement; point?: TargetPoint; align?: AlignType }>({});
     const nodeRef = ref();
     const forceAlignPropsRef = computed(() => ({
       disabled: props.disabled,
       target: props.target,
+      align: props.align,
       onAlign: props.onAlign,
     }));
 
@@ -66,6 +68,7 @@ export default defineComponent({
         const {
           disabled: latestDisabled,
           target: latestTarget,
+          align: latestAlign,
           onAlign: latestOnAlign,
         } = forceAlignPropsRef.value;
         if (!latestDisabled && latestTarget && nodeRef.value && nodeRef.value.$el) {
@@ -77,16 +80,16 @@ export default defineComponent({
 
           cacheRef.value.element = element;
           cacheRef.value.point = point;
-
+          cacheRef.value.align = latestAlign;
           // IE lose focus after element realign
           // We should record activeElement and restore later
           const { activeElement } = document;
 
           // We only align when element is visible
           if (element && isVisible(element)) {
-            result = alignElement(source, element, props.align);
+            result = alignElement(source, element, latestAlign);
           } else if (point) {
-            result = alignPoint(source, point, props.align);
+            result = alignPoint(source, point, latestAlign);
           }
 
           restoreFocus(activeElement, source);
@@ -124,7 +127,11 @@ export default defineComponent({
         sourceResizeMonitor.value.cancel = monitorResize(nodeRef.value.$el, forceAlign);
       }
 
-      if (cacheRef.value.element !== element || !isSamePoint(cacheRef.value.point, point)) {
+      if (
+        cacheRef.value.element !== element ||
+        !isSamePoint(cacheRef.value.point, point) ||
+        !isEqual(cacheRef.value.align, props.align)
+      ) {
         forceAlign();
 
         // Add resize observer