fix(sider): custom trigger does not take effect

修复侧边菜单底部的自定义折叠按钮不起作用的问题
vbenjs · Jul 1, 2021 · 5005e6e · 5005e6e
1 parent 3871204
commit 5005e6e
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
@@ -9,8 +9,7 @@
 - **Modal** 修复点击遮罩不能关闭
 - **Table** 修复 `editComponentProps` 不支持 `onChange`
 - **Modal** 修复 `setModalProps` 不支持设置 `defaultFullscreen`
-- **Sider** 修复侧边菜单底部的折叠按钮点击无效
-- **SvgIcon** 修复图标样式问题
+- **Sider** 修复侧边菜单底部的折叠自定义失效的问题
 - **Table** 修复为 table 提供 rowSelection.onChange 时，无法手动变更 table 的选中项的问题
 - **Icon** 修复 SvgIcon 缺少部分样式的问题
 - **LockScreen** 修复锁屏功能可以通过刷新页面或复制 URL 打开新的浏览器标签来跳过锁定状态的问题

diff --git a/src/layouts/default/sider/LayoutSider.vue b/src/layouts/default/sider/LayoutSider.vue
@@ -16,6 +16,7 @@
     :theme="getMenuTheme"
     @breakpoint="onBreakpointChange"
     @collapse="toggleCollapsed"
+    :trigger="getTrigger"
     v-bind="getTriggerAttr"
   >
     <template #trigger v-if="getShowTrigger">
@@ -26,7 +27,7 @@
   </Sider>
 </template>
 <script lang="ts">
-  import { computed, defineComponent, ref, unref, CSSProperties } from 'vue';
+  import { computed, defineComponent, ref, unref, CSSProperties, h } from 'vue';
 
   import { Layout } from 'ant-design-vue';
   import LayoutMenu from '../menu/index.vue';
@@ -103,13 +104,18 @@
         };
       });
 
+      // 在此处使用计算量可能会导致sider异常
+      // andv 更新后，如果trigger插槽可用，则此处代码可废弃
+      const getTrigger = h(LayoutTrigger);
+
       return {
         prefixCls,
         sideRef,
         dragBarRef,
         getIsMobile,
         getHiddenDomStyle,
         getSiderClass,
+        getTrigger,
         getTriggerAttr,
         getCollapsedWidth,
         getMenuFixed,