Browse Source

fix(sider): custom trigger does not take effect

修复侧边菜单底部的自定义折叠按钮不起作用的问题
无木 3 years ago
parent
commit
5005e6e56b
2 changed files with 8 additions and 3 deletions
  1. 1 2
      CHANGELOG.zh_CN.md
  2. 7 1
      src/layouts/default/sider/LayoutSider.vue

+ 1 - 2
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 打开新的浏览器标签来跳过锁定状态的问题

+ 7 - 1
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,6 +104,10 @@
         };
       });
 
+      // 在此处使用计算量可能会导致sider异常
+      // andv 更新后,如果trigger插槽可用,则此处代码可废弃
+      const getTrigger = h(LayoutTrigger);
+
       return {
         prefixCls,
         sideRef,
@@ -110,6 +115,7 @@
         getIsMobile,
         getHiddenDomStyle,
         getSiderClass,
+        getTrigger,
         getTriggerAttr,
         getCollapsedWidth,
         getMenuFixed,