From 861cbcc48ca72cace4510263504645c9e5fa9861 Mon Sep 17 00:00:00 2001
From: shizhongming <zhongming4762@hotmail.com>
Date: Sun, 14 Apr 2024 21:29:54 +0800
Subject: [PATCH] =?UTF-8?q?perf(=E7=BB=84=E4=BB=B6:smart-table):=20smart-t?=
 =?UTF-8?q?able=E7=BB=84=E4=BB=B6=E5=B0=BA=E5=AF=B8=E9=85=8D=E7=BD=AE?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E6=94=AF=E6=8C=81=E6=98=BE=E7=A4=BA=E5=BD=93?=
 =?UTF-8?q?=E5=89=8D=E5=B0=BA=E5=AF=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/SmartTableSizeSetting.tsx   | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/components/SmartTable/src/components/SmartTableSizeSetting.tsx b/src/components/SmartTable/src/components/SmartTableSizeSetting.tsx
index 8eaaf7c0e..c1abd2e36 100644
--- a/src/components/SmartTable/src/components/SmartTableSizeSetting.tsx
+++ b/src/components/SmartTable/src/components/SmartTableSizeSetting.tsx
@@ -1,7 +1,7 @@
 import type { SmartTableToolbarSizeSetting } from '@/components/SmartTable';
 import type { SizeType, VxeButtonProps } from 'vxe-table';
 
-import { defineComponent, h, onMounted } from 'vue';
+import { computed, defineComponent, h, onMounted, unref } from 'vue';
 
 import { Menu, Dropdown } from 'ant-design-vue';
 import { ColumnHeightOutlined } from '@ant-design/icons-vue';
@@ -25,6 +25,9 @@ export default defineComponent({
   },
   setup() {
     const tableContext = useTableContext();
+    const computedSize = computed(() => {
+      return [unref(tableContext.getBindValues).size];
+    });
     const handleChangeSize = (e) => {
       tableContext.setProps({
         size: e.key,
@@ -58,22 +61,27 @@ export default defineComponent({
     });
     return {
       handleChangeSize,
+      computedSize,
     };
   },
   render() {
-    const { config, handleChangeSize } = this;
+    const { config, handleChangeSize, computedSize } = this;
     const slots = {
       default: renderButton(config),
-      overlay: renderOverlay(config, handleChangeSize),
+      overlay: renderOverlay(config, handleChangeSize, computedSize),
     };
     return <Dropdown>{slots}</Dropdown>;
   },
 });
 
-const renderOverlay = (config: SmartTableToolbarSizeSetting, handleChangeSize: Function) => {
+const renderOverlay = (
+  config: SmartTableToolbarSizeSetting,
+  handleChangeSize: Function,
+  computedSize,
+) => {
   return () => {
     return (
-      <Menu onClick={(e) => handleChangeSize(e)}>
+      <Menu onClick={(e) => handleChangeSize(e)} selectedKeys={computedSize}>
         <Menu.Item key="middle">大</Menu.Item>
         <Menu.Item key="small">中等</Menu.Item>
         <Menu.Item key="mini">紧凑</Menu.Item>