vueComponent / pro-components

easy use `Ant Design Vue` layout
MIT License
532 stars 215 forks source link

请问旧版本的 pro-layout 组件是否没有实现 menuFooterRender 插槽? #274

Closed Wjinlei closed 1 year ago

Wjinlei commented 1 year ago

请问 1.xpro-layout 组件是否没有实现 menuFooterRender 插槽? 由于公司的老项目,用的vue2 我看了下 pro-layout 的版本是 1.0.13 我测试了但菜单底部并没有效果呢

    <!-- 侧边栏-退出登录 -->
    <template v-slot:menuFooterRender>
      <a-button>退出登录</a-button>
    </template>

我看了下源码,应该是确实没有实现这个插槽,我看到有一个menuRender可用,但用了这个插槽后,菜单项就不显示了。 请问我应该怎么样才能在菜单底部渲染一个按钮用来实现退出登录的效果?

没办法公司就让把按钮加在这里。头大。

🧐 解决方案 Solution

🚑 其他信息 Other information

Wjinlei commented 1 year ago

没事了,我实现了,用 menuRender 重新渲染菜单即可,当然,要是有 menuFooterRender插槽应该就不用这么麻烦了。

代码贴出来留给有需要的人。

<!-- 侧边栏-退出登录 -->
<template v-slot:menuRender>
  <a-menu theme="dark">
    <a-menu-item v-for="menu in menus" :key="menu.name">
      <router-link :to="menu.path" />
      <a-icon :component="menu.meta.icon" />
      <span>{{ $t(menu.meta.title) }}</span>
    </a-menu-item>
  </a-menu>

  <a-menu theme="dark" :selectable="false">
    <a-menu-item key="logout" @click="logout" style="margin: 0">
      <a-icon type="logout" />
      <span>退出登录 </span>
    </a-menu-item>
  </a-menu>
</template>