mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2025-02-11 11:39:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): fix #10431

Browse Source 
fix #10431 and unify the hooks into the hooks directory

closed #10431
This commit is contained in:
qiang 2022-11-06 22:46:52 +08:00
parent 8a694e729b
commit 76524b124c
8 changed files with 23 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/.vitepress/vitepress/styles/css-vars.scss
View File

@ -68,7 +68,7 @@
--code-text-color: var(--text-color);
--code-font-family: var(--font-family-mono);
--code-tooltip-bg-color: var(--code-bg-color);
--code-tooltip-color: #0C61C9;
--code-tooltip-color: #0c61c9;
// tip block
--block-tip-bg-color: rgba(var(--el-color-primary-rgb), 0.1);

2
docs/en-US/component/message-box.md
View File

@ -191,4 +191,4 @@ The corresponding methods are: `ElMessageBox`, `ElMessageBox.alert`, `ElMessageB
| draggable | whether MessageBox is draggable | boolean | — | false |
| round-button | whether to use round button | boolean | — | false |
| button-size | custom size of confirm and cancel buttons | string | small / default / large | default |
| append-to | set the root element for the message box | string \| HTMLElement | — | — |
| append-to | set the root element for the message box | string \| HTMLElement | — | — |

2
packages/components/menu/src/use-menu-color.ts → packages/components/menu/src/hooks/use-menu-color.ts
View File

@ -1,7 +1,7 @@
import { computed } from 'vue'
import { TinyColor } from '@ctrl/tinycolor'
import type { MenuProps } from './menu'
import type { MenuProps } from '../menu'
export default function useMenuColor(props: MenuProps) {
const menuBarColor = computed(() => {

2
packages/components/menu/src/use-menu-css-var.ts → packages/components/menu/src/hooks/use-menu-css-var.ts
View File

@ -2,7 +2,7 @@ import { computed } from 'vue'
import { useNamespace } from '@element-plus/hooks'
import useMenuColor from './use-menu-color'
import type { MenuProps } from './menu'
import type { MenuProps } from '../menu'
export const useMenuCssVar = (props: MenuProps, level: number) => {
const ns = useNamespace('menu')

0
packages/components/menu/src/use-menu.ts → packages/components/menu/src/hooks/use-menu.ts
View File

2
packages/components/menu/src/menu-item.vue
View File

@ -50,7 +50,7 @@ import ElTooltip from '@element-plus/components/tooltip'
import { Effect } from '@element-plus/components/popper'
import { throwError } from '@element-plus/utils'
import { useNamespace } from '@element-plus/hooks'
import useMenu from './use-menu'
import useMenu from './hooks/use-menu'
import { menuItemEmits, menuItemProps } from './menu-item'
import type { MenuItemRegistered, MenuProvider, SubMenuProvider } from './types'

21
packages/components/menu/src/menu.ts
View File

@ -26,7 +26,7 @@ import { useNamespace } from '@element-plus/hooks'
import Menubar from './utils/menu-bar'
import ElMenuCollapseTransition from './menu-collapse-transition.vue'
import ElSubMenu from './sub-menu'
import { useMenuCssVar } from './use-menu-css-var'
import { useMenuCssVar } from './hooks/use-menu-css-var'
import type { MenuItemClicked, MenuProvider, SubMenuProvider } from './types'
import type { NavigationFailure, Router } from 'vue-router'
@ -134,10 +134,21 @@ export default defineComponent({
// 展开该菜单项的路径上所有子菜单
// expand all subMenus of the menu item
indexPath.forEach((index) => {
const subMenu = subMenus.value[index]
subMenu && openMenu(index, subMenu.indexPath)
})
const openAllActiveItem = () => {
indexPath.forEach((index) => {
const subMenu = subMenus.value[index]
subMenu && openMenu(index, subMenu.indexPath)
})
}
if (activeIndex.value === props.defaultActive) {
openAllActiveItem()
} else {
// fix: #10431
if (indexPath.every((index) => openedMenus.value.includes(index))) {
openAllActiveItem()
}
}
}
const openMenu: MenuProvider['openMenu'] = (index, indexPath) => {

4
packages/components/menu/src/sub-menu.ts
View File

@ -26,8 +26,8 @@ import {
import { useNamespace } from '@element-plus/hooks'
import { ArrowDown, ArrowRight } from '@element-plus/icons-vue'
import { ElIcon } from '@element-plus/components/icon'
import useMenu from './use-menu'
import { useMenuCssVar } from './use-menu-css-var'
import useMenu from './hooks/use-menu'
import { useMenuCssVar } from './hooks/use-menu-css-var'
import type { Placement } from '@element-plus/components/popper'
import type { CSSProperties, ExtractPropTypes, VNodeArrayChildren } from 'vue'