fix: 横向导航栏模式下 children 无法自动隐藏

This commit is contained in:
就眠儀式
2022-02-24 17:56:05 +08:00
parent 9726687879
commit 18990ef594
6 changed files with 71 additions and 54 deletions

View File

@@ -13,7 +13,7 @@
::: demo
<template>
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys">
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys1">
<lay-menu-item title="首页" id="1"></lay-menu-item>
<lay-menu-item title="用户" id="2"></lay-menu-item>
<lay-menu-item title="角色" id="3"></lay-menu-item>
@@ -40,10 +40,10 @@ export default {
setup() {
const selectedKey = ref("5")
const openKeys = ref(["7"])
const openKeys1 = ref(["7"])
return {
selectedKey,
openKeys
openKeys1
}
}
}
@@ -57,7 +57,7 @@ export default {
::: demo
<template>
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys" :tree="true">
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys2" :tree="true">
<lay-menu-item title="首页" id="1"></lay-menu-item>
<lay-menu-item title="用户" id="2"></lay-menu-item>
<lay-menu-item title="角色" id="3"></lay-menu-item>
@@ -79,11 +79,11 @@ import { ref } from 'vue'
export default {
setup() {
const openKeys = ref(["7"])
const openKeys2 = ref(["7"])
const selectedKey = ref("5")
return {
openKeys,
openKeys2,
selectedKey
}
}
@@ -98,7 +98,7 @@ export default {
::: demo
<template>
<lay-menu level="true" v-model:selectedKey="selectedKey" inverted="true" v-model:openKeys="openKeys" :tree="true">
<lay-menu level="true" v-model:selectedKey="selectedKey" inverted="true" v-model:openKeys="openKeys3" :tree="true">
<lay-menu-item title="首页" id="1"></lay-menu-item>
<lay-menu-item title="用户" id="2"></lay-menu-item>
<lay-menu-item title="角色" id="3"></lay-menu-item>
@@ -120,11 +120,11 @@ import { ref } from 'vue'
export default {
setup() {
const openKeys = ref(["7"])
const openKeys3 = ref(["7"])
const selectedKey = ref("5")
return {
openKeys,
openKeys3,
selectedKey
}
}
@@ -139,7 +139,7 @@ export default {
::: demo
<template>
<lay-menu v-model:selectedKey="selectedKey" theme="light" v-model:openKeys="openKeys" :tree="true">
<lay-menu v-model:selectedKey="selectedKey" theme="light" v-model:openKeys="openKeys4" :tree="true">
<lay-menu-item title="首页" id="1"></lay-menu-item>
<lay-menu-item title="用户" id="2"></lay-menu-item>
<lay-menu-item title="角色" id="3"></lay-menu-item>
@@ -161,11 +161,11 @@ import { ref } from 'vue'
export default {
setup() {
const openKeys = ref(["7"])
const openKeys4 = ref(["7"])
const selectedKey = ref("5")
return {
openKeys,
openKeys4,
selectedKey
}
}
@@ -180,7 +180,7 @@ export default {
::: demo
<template>
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys" v-model:tree="isTree">
<lay-menu v-model:selectedKey="selectedKey" v-model:openKeys="openKeys5" v-model:tree="isTree">
<lay-menu-item id="1">
<router-link to="">
<lay-icon type="layui-icon-home"></lay-icon>
@@ -218,11 +218,11 @@ export default {
const isTree = ref(true)
const selectedKey = ref("5")
const openKeys = ref(["7"])
const openKeys5 = ref(["7"])
return {
isTree,
openKeys,
openKeys5,
selectedKey
}
}

View File

@@ -4,6 +4,12 @@
::: title 基础使用
:::
::: describe 常用于行数据的交互筛选,在浩瀚的业务需求中,值得一用。
:::
::: title 基础使用
:::
::: demo 使用 `lay-transfer` 标签, 创建穿梭框
<template>

View File

@@ -22,32 +22,31 @@ const themeVariable = {
:::
```
--global-primary-color: #009688;
--global-primary-color: #009688; // 主题色
--global-normal-color: #1e9fff;
--global-normal-color: #1e9fff; // 通用色
--global-warm-color: #ffb800;
--global-warm-color: #ffb800; // 警告色
--global-danger-color: #ff5722;
--global-danger-color: #ff5722; // 危险色
--global-checked-color: #5fb878;
--global-checked-color: #5fb878; // 选中色
--global-border-radius: 2px;
--global-border-radius: 2px; // 圆角度
--global-neutral-color-1: #FAFAFA;
--global-neutral-color-1: #FAFAFA; // 辅助色-1
--global-neutral-color-2: #F6F6F6;
--global-neutral-color-2: #F6F6F6; // 辅助色-2
--global-neutral-color-3: #eeeeee; // 辅助色-3
--global-neutral-color-4: #e2e2e2; // 辅助色-4
--global-neutral-color-3: #eeeeee;
--global-neutral-color-5: #dddddd; // 辅助色-5
--global-neutral-color-4: #e2e2e2;
--global-neutral-color-6: #d2d2d2; // 辅助色-6
--global-neutral-color-5: #dddddd;
--global-neutral-color-7: #cccccc; // 辅助色-7
--global-neutral-color-6: #d2d2d2;
--global-neutral-color-7: #cccccc;
--global-neutral-color-8: #c2c2c2;
--global-neutral-color-8: #c2c2c2; // 辅助色-8
```