🐛(menu): 修复 menu 组件 mored 图标不随状态变化

This commit is contained in:
就眠儀式 2022-05-12 05:45:43 +08:00
parent 28fe83c02d
commit ea06a05198
5 changed files with 9 additions and 15 deletions

View File

@ -309,8 +309,3 @@
background-color: transparent; background-color: transparent;
} }
} }
.layui-nav-child-spacing .layui-nav-item .layui-nav-child {
padding-left: 10px;
box-sizing: border-box;
}

View File

@ -12,7 +12,6 @@ import {
Ref, Ref,
ref, ref,
watch, watch,
WritableComputedRef,
} from "vue"; } from "vue";
import "./index.less"; import "./index.less";
@ -25,7 +24,6 @@ export interface LayMenuProps {
level?: boolean | string; level?: boolean | string;
collapse?: boolean | string; collapse?: boolean | string;
collapseTransition?: boolean | string; collapseTransition?: boolean | string;
childSpacing?: boolean;
} }
const emit = defineEmits([ const emit = defineEmits([
@ -43,8 +41,7 @@ const props = withDefaults(defineProps<LayMenuProps>(), {
inverted: false, inverted: false,
level: true, level: true,
collapse: false, collapse: false,
collapseTransition: true, collapseTransition: true
childSpacing: false,
}); });
const isTree: ComputedRef = computed(() => props.tree); const isTree: ComputedRef = computed(() => props.tree);
@ -102,8 +99,7 @@ provide("isCollapseTransition", isCollapseTransition);
inverted ? 'inverted' : '', inverted ? 'inverted' : '',
tree ? 'layui-nav-tree' : '', tree ? 'layui-nav-tree' : '',
theme === 'dark' ? 'layui-nav-dark' : 'layui-nav-light', theme === 'dark' ? 'layui-nav-dark' : 'layui-nav-light',
collapse ? 'layui-nav-collapse' : '', collapse ? 'layui-nav-collapse' : ''
childSpacing ? 'layui-nav-child-spacing' : '',
]" ]"
> >
<slot></slot> <slot></slot>

View File

@ -89,14 +89,17 @@ onBeforeUnmount(() => window.removeEventListener("resize", setPosition));
<template> <template>
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="javascript:void(0)" @click="openHandle()"> <a href="javascript:void(0)" @click="openHandle()">
<!-- 图标 -->
<i> <i>
<slot v-if="slots.icon" name="icon"></slot> <slot v-if="slots.icon" name="icon"></slot>
</i> </i>
<!-- 标题 -->
<span> <span>
<slot v-if="slots.title" name="title"></slot> <slot v-if="slots.title" name="title"></slot>
</span> </span>
<!-- 扩展 -->
<i <i
:class="[isOpen && !isTree ? 'layui-nav-mored' : '']" :class="[isOpen ? 'layui-nav-mored' : '']"
class="layui-icon layui-icon-down layui-nav-more" class="layui-icon layui-icon-down layui-nav-more"
></i> ></i>
</a> </a>

View File

@ -37,7 +37,7 @@ export const usePlayGround = async (
code = `${decodeCode} code = `${decodeCode}
<script lang="ts" setup> <script lang="ts" setup>
</script>` </script>`;
} }
// 去除 export default,保留其中的内容 // 去除 export default,保留其中的内容