(menu): 新增 menu 组件 expandIcon 插槽

This commit is contained in:
就眠儀式
2022-05-12 09:19:09 +08:00
parent ea06a05198
commit 5440b6ac92
3 changed files with 14 additions and 12 deletions

View File

@@ -5,14 +5,7 @@ export default {
</script>
<script setup lang="ts">
import {
computed,
ComputedRef,
provide,
Ref,
ref,
watch,
} from "vue";
import { computed, ComputedRef, provide, Ref, ref, watch } from "vue";
import "./index.less";
export interface LayMenuProps {
@@ -41,7 +34,7 @@ const props = withDefaults(defineProps<LayMenuProps>(), {
inverted: false,
level: true,
collapse: false,
collapseTransition: true
collapseTransition: true,
});
const isTree: ComputedRef = computed(() => props.tree);
@@ -99,7 +92,7 @@ provide("isCollapseTransition", isCollapseTransition);
inverted ? 'inverted' : '',
tree ? 'layui-nav-tree' : '',
theme === 'dark' ? 'layui-nav-dark' : 'layui-nav-light',
collapse ? 'layui-nav-collapse' : ''
collapse ? 'layui-nav-collapse' : '',
]"
>
<slot></slot>

View File

@@ -98,9 +98,15 @@ onBeforeUnmount(() => window.removeEventListener("resize", setPosition));
<slot v-if="slots.title" name="title"></slot>
</span>
<!-- 扩展 -->
<i v-if="slots.expandIcon" class="layui-nav-more">
<slot name="expandIcon" :isExpand="isOpen"></slot>
</i>
<i
:class="[isOpen ? 'layui-nav-mored' : '']"
class="layui-icon layui-icon-down layui-nav-more"
v-else
:class="[isOpen ?
'layui-nav-mored' : '',
'layui-icon layui-icon-down',
'layui-nav-more']"
></i>
</a>
<template v-if="isTree">