菜单 AsamMenu

使用场景

组织可选择的导航项和分组。

基础用法与状态

下列示例只使用本入口的实际公开能力。

基础用法与状态

vue

<template>
	<AsamMenu default-active="overview" @select="selected = $event">
		<AsamMenuItem index="overview">概览</AsamMenuItem>
		<AsamSubMenu index="records">
			<template #title>记录</template>
			<AsamMenuItemGroup title="本地记录">
				<AsamMenuItem index="draft">草稿</AsamMenuItem>
				<AsamMenuItem index="locked" disabled>锁定记录</AsamMenuItem>
			</AsamMenuItemGroup>
		</AsamSubMenu>
	</AsamMenu>
	<p class="example-paragraph" role="status">选择：{{ selected }}</p>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuBasicDemo' });
import { ref } from 'vue';
import { AsamMenu, AsamMenuItem, AsamSubMenu, AsamMenuItemGroup } from '@asam-ui/ui';
const selected = ref('overview');
</script>

<style scoped>
p:where(.example-paragraph) {
	margin-block: 16px;
	line-height: 1.8;
	overflow-wrap: anywhere;
}
</style>

vue

<template>
	<AsamMenu default-active="overview" @select="selected = $event">
		<AsamMenuItem index="overview">概览</AsamMenuItem>
		<AsamSubMenu index="records">
			<template #title>记录</template>
			<AsamMenuItemGroup title="本地记录">
				<AsamMenuItem index="draft">草稿</AsamMenuItem>
				<AsamMenuItem index="locked" disabled>锁定记录</AsamMenuItem>
			</AsamMenuItemGroup>
		</AsamSubMenu>
	</AsamMenu>
	<p class="example-paragraph" role="status">选择：{{ selected }}</p>
</template>

<script setup>
defineOptions({ name: 'AsamMenuBasicDemo' });
import { ref } from 'vue';
import { AsamMenu, AsamMenuItem, AsamSubMenu, AsamMenuItemGroup } from '@asam-ui/ui';
const selected = ref('overview');
</script>

<style scoped>
p:where(.example-paragraph) {
	margin-block: 16px;
	line-height: 1.8;
	overflow-wrap: anywhere;
}
</style>

使用约定

mode、collapse、defaultActive/defaultOpeneds、uniqueOpened、router 和触发策略以公开 Props 配置；select/open/close 反馈实际选择和展开。完整说明。

水平菜单高度

mode 为 horizontal 时，可通过原生 CSS 变量 --el-menu-horizontal-height 覆盖默认菜单高度。给 AsamMenu 添加自己的 class，再在使用方局部样式中设置该变量，例如：

css

.menu-with-height.el-menu--horizontal {
	--el-menu-horizontal-height: 100px;
}

将 class="menu-with-height" 传给对应 AsamMenu 即可；数值是宿主布局设置，不是新增的 height prop，也不代表四档控件密度。此处只覆盖指定菜单，不修改共享样式。

完整使用场景

顶栏

顶部栏菜单可以在各种场景中使用。

导航菜单默认为垂直模式，通过将 mode 属性设置为 horizontal 来使导航菜单变更为水平模式。完整说明。

基础用法

许可

vue

<template>
	<AsamMenu
		:default-active="activeIndex"
		class="el-menu-demo"
		mode="horizontal"
		@select="handleSelect"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="3" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="4">订单</AsamMenuItem>
	</AsamMenu>
	<div class="h-6" />
	<AsamMenu
		:default-active="activeIndex2"
		class="el-menu-demo"
		mode="horizontal"
		background-color="#545c64"
		text-color="#fff"
		active-text-color="#ffd04b"
		@select="handleSelect"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="3" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="4">订单</AsamMenuItem>
	</AsamMenu>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuCapBasicDemo' });
import { AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';

import { ref } from 'vue';

const activeIndex = ref('1');
const activeIndex2 = ref('1');
const handleSelect = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* Local styles keep this sample runnable without a website utility-CSS preset. */
.h-6 {
	height: 1.5rem;
}
</style>

许可

vue

<template>
	<AsamMenu
		:default-active="activeIndex"
		class="el-menu-demo"
		mode="horizontal"
		@select="handleSelect"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="3" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="4">订单</AsamMenuItem>
	</AsamMenu>
	<div class="h-6" />
	<AsamMenu
		:default-active="activeIndex2"
		class="el-menu-demo"
		mode="horizontal"
		background-color="#545c64"
		text-color="#fff"
		active-text-color="#ffd04b"
		@select="handleSelect"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="3" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="4">订单</AsamMenuItem>
	</AsamMenu>
</template>

<script setup>
defineOptions({ name: 'AsamMenuCapBasicDemo' });
import { AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
import { ref } from 'vue';
const activeIndex = ref('1');
const activeIndex2 = ref('1');
const handleSelect = (key, keyPath) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* Local styles keep this sample runnable without a website utility-CSS preset. */
.h-6 {
	height: 1.5rem;
}
</style>

左右

您可以将菜单项放置在左边或右边。

左右

许可

vue

<template>
	<AsamMenu
		:default-active="activeIndex"
		class="el-menu-demo"
		mode="horizontal"
		:ellipsis="false"
		@select="handleSelect"
	>
		<AsamMenuItem index="0">
			<AsamImage
				style="width: 100px"
				src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22180%22%3E%3Crect%20width%3D%22320%22%20height%3D%22180%22%20fill%3D%22%238899aa%22%2F%3E%3Ccircle%20cx%3D%22240%22%20cy%3D%2245%22%20r%3D%2228%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M0%20180L100%2060L220%20180%22%20fill%3D%22%2340566c%22%2F%3E%3Ctext%20x%3D%2212%22%20y%3D%2230%22%20fill%3D%22%23fff%22%3EASAM%20%E7%A4%BA%E4%BE%8B%3C%2Ftext%3E%3C%2Fsvg%3E"
				alt="组件标志"
			/>
		</AsamMenuItem>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
	</AsamMenu>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuCapLeftAndRightDemo' });
import { AsamImage, AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';

import { ref } from 'vue';

const activeIndex = ref('1');
const handleSelect = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* stylelint-disable selector-class-pattern -- Base-component BEM selectors are required for this demonstration. */

.el-menu--horizontal > .el-menu-item:nth-child(1) {
	margin-right: auto;
}

/* stylelint-enable selector-class-pattern */
</style>

许可

vue

<template>
	<AsamMenu
		:default-active="activeIndex"
		class="el-menu-demo"
		mode="horizontal"
		:ellipsis="false"
		@select="handleSelect"
	>
		<AsamMenuItem index="0">
			<AsamImage
				style="width: 100px"
				src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22180%22%3E%3Crect%20width%3D%22320%22%20height%3D%22180%22%20fill%3D%22%238899aa%22%2F%3E%3Ccircle%20cx%3D%22240%22%20cy%3D%2245%22%20r%3D%2228%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M0%20180L100%2060L220%20180%22%20fill%3D%22%2340566c%22%2F%3E%3Ctext%20x%3D%2212%22%20y%3D%2230%22%20fill%3D%22%23fff%22%3EASAM%20%E7%A4%BA%E4%BE%8B%3C%2Ftext%3E%3C%2Fsvg%3E"
				alt="组件标志"
			/>
		</AsamMenuItem>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
	</AsamMenu>
</template>

<script setup>
defineOptions({ name: 'AsamMenuCapLeftAndRightDemo' });
import { AsamImage, AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
import { ref } from 'vue';
const activeIndex = ref('1');
const handleSelect = (key, keyPath) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* stylelint-disable selector-class-pattern -- Base-component BEM selectors are required for this demonstration. */

.el-menu--horizontal > .el-menu-item:nth-child(1) {
	margin-right: auto;
}

/* stylelint-enable selector-class-pattern */
</style>

侧栏

垂直菜单，可内嵌子菜单。

使用 AsamMenuItemGroup 创建菜单分组，分组名称由 title prop 或同名插槽提供。

垂直布局

许可

vue

<!-- 此演示还使用 @asam-ui/icons-vue，请按官网对应指南配置这些公开依赖。 -->
<template>
	<AsamRow class="tac">
		<AsamCol :span="12">
			<h5 class="mb-2">默认配色</h5>
			<AsamMenu
				default-active="2"
				class="el-menu-vertical-demo"
				@open="handleOpen"
				@close="handleClose"
			>
				<AsamSubMenu index="1">
					<template #title>
						<AsamIcon><location /></AsamIcon>
						<span>导航一</span>
					</template>
					<AsamMenuItemGroup title="第一组">
						<AsamMenuItem index="1-1">第一项</AsamMenuItem>
						<AsamMenuItem index="1-2">第二项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamMenuItemGroup title="第二组">
						<AsamMenuItem index="1-3">第三项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamSubMenu index="1-4">
						<template #title>第四项</template>
						<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
					</AsamSubMenu>
				</AsamSubMenu>
				<AsamMenuItem index="2">
					<AsamIcon><icon-menu /></AsamIcon>
					<span>导航二</span>
				</AsamMenuItem>
				<AsamMenuItem index="3" disabled>
					<AsamIcon><document /></AsamIcon>
					<span>导航三</span>
				</AsamMenuItem>
				<AsamMenuItem index="4">
					<AsamIcon><setting /></AsamIcon>
					<span>导航四</span>
				</AsamMenuItem>
			</AsamMenu>
		</AsamCol>
		<AsamCol :span="12">
			<h5 class="mb-2">自定义配色</h5>
			<AsamMenu
				active-text-color="#ffd04b"
				background-color="#545c64"
				class="el-menu-vertical-demo"
				default-active="2"
				text-color="#fff"
				@open="handleOpen"
				@close="handleClose"
			>
				<AsamSubMenu index="1">
					<template #title>
						<AsamIcon><location /></AsamIcon>
						<span>导航一</span>
					</template>
					<AsamMenuItemGroup title="第一组">
						<AsamMenuItem index="1-1">第一项</AsamMenuItem>
						<AsamMenuItem index="1-2">第二项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamMenuItemGroup title="第二组">
						<AsamMenuItem index="1-3">第三项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamSubMenu index="1-4">
						<template #title>第四项</template>
						<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
					</AsamSubMenu>
				</AsamSubMenu>
				<AsamMenuItem index="2">
					<AsamIcon><icon-menu /></AsamIcon>
					<span>导航二</span>
				</AsamMenuItem>
				<AsamMenuItem index="3" disabled>
					<AsamIcon><document /></AsamIcon>
					<span>导航三</span>
				</AsamMenuItem>
				<AsamMenuItem index="4">
					<AsamIcon><setting /></AsamIcon>
					<span>导航四</span>
				</AsamMenuItem>
			</AsamMenu>
		</AsamCol>
	</AsamRow>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuCapVerticalDemo' });
import {
	AsamRow,
	AsamCol,
	AsamMenu,
	AsamSubMenu,
	AsamIcon,
	AsamMenuItemGroup,
	AsamMenuItem
} from '@asam-ui/ui';

import { Document, Menu as IconMenu, Location, Setting } from '@asam-ui/icons-vue';

const handleOpen = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
const handleClose = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* Local styles keep this sample runnable without a website utility-CSS preset. */
.mb-2 {
	margin-bottom: 0.5rem;
}
</style>

许可

vue

<!-- 此演示还使用 @asam-ui/icons-vue，请按官网对应指南配置这些公开依赖。 -->
<template>
	<AsamRow class="tac">
		<AsamCol :span="12">
			<h5 class="mb-2">默认配色</h5>
			<AsamMenu
				default-active="2"
				class="el-menu-vertical-demo"
				@open="handleOpen"
				@close="handleClose"
			>
				<AsamSubMenu index="1">
					<template #title>
						<AsamIcon><location /></AsamIcon>
						<span>导航一</span>
					</template>
					<AsamMenuItemGroup title="第一组">
						<AsamMenuItem index="1-1">第一项</AsamMenuItem>
						<AsamMenuItem index="1-2">第二项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamMenuItemGroup title="第二组">
						<AsamMenuItem index="1-3">第三项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamSubMenu index="1-4">
						<template #title>第四项</template>
						<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
					</AsamSubMenu>
				</AsamSubMenu>
				<AsamMenuItem index="2">
					<AsamIcon><icon-menu /></AsamIcon>
					<span>导航二</span>
				</AsamMenuItem>
				<AsamMenuItem index="3" disabled>
					<AsamIcon><document /></AsamIcon>
					<span>导航三</span>
				</AsamMenuItem>
				<AsamMenuItem index="4">
					<AsamIcon><setting /></AsamIcon>
					<span>导航四</span>
				</AsamMenuItem>
			</AsamMenu>
		</AsamCol>
		<AsamCol :span="12">
			<h5 class="mb-2">自定义配色</h5>
			<AsamMenu
				active-text-color="#ffd04b"
				background-color="#545c64"
				class="el-menu-vertical-demo"
				default-active="2"
				text-color="#fff"
				@open="handleOpen"
				@close="handleClose"
			>
				<AsamSubMenu index="1">
					<template #title>
						<AsamIcon><location /></AsamIcon>
						<span>导航一</span>
					</template>
					<AsamMenuItemGroup title="第一组">
						<AsamMenuItem index="1-1">第一项</AsamMenuItem>
						<AsamMenuItem index="1-2">第二项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamMenuItemGroup title="第二组">
						<AsamMenuItem index="1-3">第三项</AsamMenuItem>
					</AsamMenuItemGroup>
					<AsamSubMenu index="1-4">
						<template #title>第四项</template>
						<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
					</AsamSubMenu>
				</AsamSubMenu>
				<AsamMenuItem index="2">
					<AsamIcon><icon-menu /></AsamIcon>
					<span>导航二</span>
				</AsamMenuItem>
				<AsamMenuItem index="3" disabled>
					<AsamIcon><document /></AsamIcon>
					<span>导航三</span>
				</AsamMenuItem>
				<AsamMenuItem index="4">
					<AsamIcon><setting /></AsamIcon>
					<span>导航四</span>
				</AsamMenuItem>
			</AsamMenu>
		</AsamCol>
	</AsamRow>
</template>

<script setup>
defineOptions({ name: 'AsamMenuCapVerticalDemo' });
import {
	AsamRow,
	AsamCol,
	AsamMenu,
	AsamSubMenu,
	AsamIcon,
	AsamMenuItemGroup,
	AsamMenuItem
} from '@asam-ui/ui';
import { Document, Menu as IconMenu, Location, Setting } from '@asam-ui/icons-vue';
const handleOpen = (key, keyPath) => {
	console.log(key, keyPath);
};
const handleClose = (key, keyPath) => {
	console.log(key, keyPath);
};
</script>

<style scoped>
/* Local styles keep this sample runnable without a website utility-CSS preset. */
.mb-2 {
	margin-bottom: 0.5rem;
}
</style>

Collapse 折叠面板

垂直导航菜单可以被折叠

Collapse 折叠面板

许可

vue

<!-- 此演示还使用 @asam-ui/icons-vue，请按官网对应指南配置这些公开依赖。 -->
<template>
	<AsamRadioGroup
		:model-value="isCollapse"
		style="margin-bottom: 20px"
		@update:model-value="
			(value) => {
				if (typeof value === 'boolean') isCollapse = value;
			}
		"
	>
		<AsamRadioButton :value="false">expand</AsamRadioButton>
		<AsamRadioButton :value="true">collapse</AsamRadioButton>
	</AsamRadioGroup>
	<AsamMenu
		default-active="2"
		class="el-menu-vertical-demo"
		:collapse="isCollapse"
		@open="handleOpen"
		@close="handleClose"
	>
		<AsamSubMenu index="1">
			<template #title>
				<AsamIcon><location /></AsamIcon>
				<span>导航一</span>
			</template>
			<AsamMenuItemGroup>
				<template #title><span>第一组</span></template>
				<AsamMenuItem index="1-1">第一项</AsamMenuItem>
				<AsamMenuItem index="1-2">第二项</AsamMenuItem>
			</AsamMenuItemGroup>
			<AsamMenuItemGroup title="第二组">
				<AsamMenuItem index="1-3">第三项</AsamMenuItem>
			</AsamMenuItemGroup>
			<AsamSubMenu index="1-4">
				<template #title><span>第四项</span></template>
				<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="2">
			<AsamIcon><icon-menu /></AsamIcon>
			<template #title>导航二</template>
		</AsamMenuItem>
		<AsamMenuItem index="3" disabled>
			<AsamIcon><document /></AsamIcon>
			<template #title>导航三</template>
		</AsamMenuItem>
		<AsamMenuItem index="4">
			<AsamIcon><setting /></AsamIcon>
			<template #title>导航四</template>
		</AsamMenuItem>
	</AsamMenu>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuCapCollapseDemo' });
import {
	AsamRadioGroup,
	AsamRadioButton,
	AsamMenu,
	AsamSubMenu,
	AsamIcon,
	AsamMenuItemGroup,
	AsamMenuItem
} from '@asam-ui/ui';

import { ref } from 'vue';
import { Document, Menu as IconMenu, Location, Setting } from '@asam-ui/icons-vue';

const isCollapse = ref(true);
const handleOpen = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
const handleClose = (key: string, keyPath: string[]) => {
	console.log(key, keyPath);
};
</script>

<style>
/* stylelint-disable selector-class-pattern -- Base-component BEM selectors are required for this demonstration. */

.el-menu-vertical-demo:not(.el-menu--collapse) {
	width: 200px;
	min-height: 400px;
}

/* stylelint-enable selector-class-pattern */
</style>

许可

vue

<!-- 此演示还使用 @asam-ui/icons-vue，请按官网对应指南配置这些公开依赖。 -->
<template>
	<AsamRadioGroup
		:model-value="isCollapse"
		style="margin-bottom: 20px"
		@update:model-value="
			(value) => {
				if (typeof value === 'boolean') isCollapse = value;
			}
		"
	>
		<AsamRadioButton :value="false">expand</AsamRadioButton>
		<AsamRadioButton :value="true">collapse</AsamRadioButton>
	</AsamRadioGroup>
	<AsamMenu
		default-active="2"
		class="el-menu-vertical-demo"
		:collapse="isCollapse"
		@open="handleOpen"
		@close="handleClose"
	>
		<AsamSubMenu index="1">
			<template #title>
				<AsamIcon><location /></AsamIcon>
				<span>导航一</span>
			</template>
			<AsamMenuItemGroup>
				<template #title><span>第一组</span></template>
				<AsamMenuItem index="1-1">第一项</AsamMenuItem>
				<AsamMenuItem index="1-2">第二项</AsamMenuItem>
			</AsamMenuItemGroup>
			<AsamMenuItemGroup title="第二组">
				<AsamMenuItem index="1-3">第三项</AsamMenuItem>
			</AsamMenuItemGroup>
			<AsamSubMenu index="1-4">
				<template #title><span>第四项</span></template>
				<AsamMenuItem index="1-4-1">第一项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="2">
			<AsamIcon><icon-menu /></AsamIcon>
			<template #title>导航二</template>
		</AsamMenuItem>
		<AsamMenuItem index="3" disabled>
			<AsamIcon><document /></AsamIcon>
			<template #title>导航三</template>
		</AsamMenuItem>
		<AsamMenuItem index="4">
			<AsamIcon><setting /></AsamIcon>
			<template #title>导航四</template>
		</AsamMenuItem>
	</AsamMenu>
</template>

<script setup>
defineOptions({ name: 'AsamMenuCapCollapseDemo' });
import {
	AsamRadioGroup,
	AsamRadioButton,
	AsamMenu,
	AsamSubMenu,
	AsamIcon,
	AsamMenuItemGroup,
	AsamMenuItem
} from '@asam-ui/ui';
import { ref } from 'vue';
import { Document, Menu as IconMenu, Location, Setting } from '@asam-ui/icons-vue';
const isCollapse = ref(true);
const handleOpen = (key, keyPath) => {
	console.log(key, keyPath);
};
const handleClose = (key, keyPath) => {
	console.log(key, keyPath);
};
</script>

<style>
/* stylelint-disable selector-class-pattern -- Base-component BEM selectors are required for this demonstration. */

.el-menu-vertical-demo:not(.el-menu--collapse) {
	width: 200px;
	min-height: 400px;
}

/* stylelint-enable selector-class-pattern */
</style>

弹出层偏移量 2.4.4

当提供了 popperOffset 配置，会覆盖 Menu 的 popper-offset.

弹出层偏移量 2.4.4

许可

vue

<template>
	<AsamMenu
		ellipsis
		class="el-menu-popper-demo"
		mode="horizontal"
		:popper-offset="16"
		style="max-width: 600px"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamSubMenu index="3" :popper-offset="8">
			<template #title>覆盖浮层偏移量</template>
			<AsamMenuItem index="3-1">第一项</AsamMenuItem>
			<AsamMenuItem index="3-2">第二项</AsamMenuItem>
			<AsamMenuItem index="3-3">第三项</AsamMenuItem>
			<AsamSubMenu index="3-4" :popper-offset="20">
				<template #title>覆盖子级配置</template>
				<AsamMenuItem index="3-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="3-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="3-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="4" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="5">订单</AsamMenuItem>
	</AsamMenu>
</template>

<script lang="ts" setup>
defineOptions({ name: 'AsamMenuCapPopperOffsetDemo' });
import { AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
</script>

许可

vue

<template>
	<AsamMenu
		ellipsis
		class="el-menu-popper-demo"
		mode="horizontal"
		:popper-offset="16"
		style="max-width: 600px"
	>
		<AsamMenuItem index="1">处理中心</AsamMenuItem>
		<AsamSubMenu index="2">
			<template #title>工作区</template>
			<AsamMenuItem index="2-1">第一项</AsamMenuItem>
			<AsamMenuItem index="2-2">第二项</AsamMenuItem>
			<AsamMenuItem index="2-3">第三项</AsamMenuItem>
			<AsamSubMenu index="2-4">
				<template #title>第四项</template>
				<AsamMenuItem index="2-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="2-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="2-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamSubMenu index="3" :popper-offset="8">
			<template #title>覆盖浮层偏移量</template>
			<AsamMenuItem index="3-1">第一项</AsamMenuItem>
			<AsamMenuItem index="3-2">第二项</AsamMenuItem>
			<AsamMenuItem index="3-3">第三项</AsamMenuItem>
			<AsamSubMenu index="3-4" :popper-offset="20">
				<template #title>覆盖子级配置</template>
				<AsamMenuItem index="3-4-1">第一项</AsamMenuItem>
				<AsamMenuItem index="3-4-2">第二项</AsamMenuItem>
				<AsamMenuItem index="3-4-3">第三项</AsamMenuItem>
			</AsamSubMenu>
		</AsamSubMenu>
		<AsamMenuItem index="4" disabled>信息</AsamMenuItem>
		<AsamMenuItem index="5">订单</AsamMenuItem>
	</AsamMenu>
</template>

<script setup>
defineOptions({ name: 'AsamMenuCapPopperOffsetDemo' });
import { AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
</script>

重算布局与更新选中项

handleResize 重算水平菜单溢出，updateActiveIndex 接受字符串 index。open/close 仍控制注册的子菜单。AsamMenuItem 必须提供字符串 index；更新激活项不会伪造用户 select 事件。

重算布局与更新选中项

vue

<template>
	<div class="demo-root-layout">
		<AsamButton type="default" native-type="button" @click="menu?.updateActiveIndex('two')"
			>激活第二项</AsamButton
		>
		<AsamButton
		 type="default"
			native-type="button"
			@click="
				menu?.handleResize();
				result = 'resized';
			"
		>
			重算布局
		</AsamButton>
		<AsamButton type="default" native-type="button" @click="menu?.open('sub')"
			>展开子菜单</AsamButton
		>
		<AsamButton type="default" native-type="button" @click="menu?.close('sub')"
			>关闭子菜单</AsamButton
		>
		<AsamMenu ref="menu" default-active="one" @select="(index) => (result = index)">
			<AsamMenuItem index="one">第一项</AsamMenuItem>
			<AsamMenuItem index="two">第二项</AsamMenuItem>
			<AsamSubMenu index="sub">
				<template #title>子菜单</template><AsamMenuItem index="child">子项</AsamMenuItem>
			</AsamSubMenu>
		</AsamMenu>
		<output>{{ result }}</output>
	</div>
</template>
<script lang="ts" setup>
defineOptions({ name: 'AsamMenuMethodsDemo' });
import { ref } from 'vue';
import { AsamButton, AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
import type { AsamMenuExpose } from '@asam-ui/ui';
const menu = ref<AsamMenuExpose>();
const result = ref('');
</script>

<style scoped>
.demo-root-layout {
	display: grid;
	gap: var(--asam-space-md);
	justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
	margin-block: 0;
}
</style>

vue

<template>
	<div class="demo-root-layout">
		<AsamButton type="default" native-type="button" @click="menu?.updateActiveIndex('two')"
			>激活第二项</AsamButton
		>
		<AsamButton
		 type="default"
			native-type="button"
			@click="
				menu?.handleResize();
				result = 'resized';
			"
		>
			重算布局
		</AsamButton>
		<AsamButton type="default" native-type="button" @click="menu?.open('sub')"
			>展开子菜单</AsamButton
		>
		<AsamButton type="default" native-type="button" @click="menu?.close('sub')"
			>关闭子菜单</AsamButton
		>
		<AsamMenu ref="menu" default-active="one" @select="(index) => (result = index)">
			<AsamMenuItem index="one">第一项</AsamMenuItem>
			<AsamMenuItem index="two">第二项</AsamMenuItem>
			<AsamSubMenu index="sub">
				<template #title>子菜单</template><AsamMenuItem index="child">子项</AsamMenuItem>
			</AsamSubMenu>
		</AsamMenu>
		<output>{{ result }}</output>
	</div>
</template>
<script setup>
defineOptions({ name: 'AsamMenuMethodsDemo' });
import { ref } from 'vue';
import { AsamButton, AsamMenu, AsamMenuItem, AsamSubMenu } from '@asam-ui/ui';
const menu = ref();
const result = ref('');
</script>

<style scoped>
.demo-root-layout {
	display: grid;
	gap: var(--asam-space-md);
	justify-items: start;
}
.demo-root-layout > :is(p, pre, output) {
	margin-block: 0;
}
</style>

API

属性 `AsamMenuProps`

属性名	说明	类型	默认值
`collapse`	是否水平折叠收起菜单（仅在 mode 为 vertical 时可用）	`boolean \| undefined`	`false`
`ellipsis`	是否省略多余的子项（仅在横向模式生效）	`(AsamMenuProps)["ellipsis"]`	`true`
`mode`	菜单展示模式	`enum"horizontal" \| "vertical"`完整类型：`(AsamMenuProps)["mode"]`	`"vertical"`
`popperClass`	用于所有弹出菜单和标题提示的自定义类名	`AsamMenuProps["popperClass"]`	`undefined`
`popperStyle`	为 popper 添加自定义样式	`(AsamMenuProps)["popperStyle"]`	`undefined`
`persistent`	当菜单处于非活动状态且 persistent 为 false 时，下拉菜单将被销毁	`(AsamMenuProps)["persistent"]`	`true`
`showTimeout`	菜单出现前的延迟	`number \| undefined`	`300`
`hideTimeout`	菜单消失前的延迟	`number \| undefined`	`300`
`defaultActive`	页面加载时默认激活菜单的 index	`string \| undefined`	`""`
`defaultOpeneds`	默认打开的 sub-menu 的 index 的数组	`string[] \| undefined`	`工厂函数（每个实例创建）`
`menuTrigger`	子菜单打开的触发方式，只在 mode 为 horizontal 时有效。	`enum"hover" \| "click"`完整类型：`(AsamMenuProps)["menuTrigger"]`	`"hover"`
`collapseTransition`	是否开启折叠动画	`(AsamMenuProps)["collapseTransition"]`	`true`
`popperOffset`	弹出层的偏移量(对所有子菜单有效)	`number \| undefined`	`6`
`ellipsisIcon`	自定义省略图标 (仅在水平模式下可用)	`(AsamMenuProps)["ellipsisIcon"]`	`工厂函数（每个实例创建）`
`popperEffect`	Tooltip 主题，内置了 dark / light 两种主题，当菜单折叠时生效。	`enum"light" \| "dark"`完整类型：`(AsamMenuProps)["popperEffect"]`	`"dark"`
`uniqueOpened`	是否只保持一个子菜单的展开	`boolean \| undefined`	`false`
`router`	是否启用 vue-router 模式。启用该模式会在激活导航时以 index 作为 path 进行路由跳转使用 default-active 来设置加载时的激活项。	`boolean \| undefined`	`false`
`closeOnClickOutside`	可选，单击外部时是否折叠菜单	`boolean \| undefined`	`false`
`style`	—	`unknown`	—
`onSelect`	—	`(AsamMenuProps)["onSelect"]`	—
`key`	—	`PropertyKey \| undefined`	—
`ref`	—	`VNodeRef \| undefined`	—
`ref_for`	—	`boolean \| undefined`	—
`ref_key`	—	`string \| undefined`	—
`onVnodeBeforeMount`	—	`(AsamMenuProps)["onVnodeBeforeMount"]`	—
`onVnodeMounted`	—	`(AsamMenuProps)["onVnodeMounted"]`	—
`onVnodeBeforeUpdate`	—	`(AsamMenuProps)["onVnodeBeforeUpdate"]`	—
`onVnodeUpdated`	—	`(AsamMenuProps)["onVnodeUpdated"]`	—
`onVnodeBeforeUnmount`	—	`(AsamMenuProps)["onVnodeBeforeUnmount"]`	—
`onVnodeUnmounted`	—	`(AsamMenuProps)["onVnodeUnmounted"]`	—
`class`	—	`unknown`	—
`onClose`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—
`backgroundColor`	菜单的背景颜色 (十六进制格式) (推荐在样式类中使用 --el-menu-bg-color)	`string \| undefined`	—
`textColor`	菜单的文字颜色 (十六进制格式) (推荐在样式类中使用 --el-menu-text-color)	`string \| undefined`	—
`activeTextColor`	活动菜单项的文本颜色（十六进制格式）（推荐使用 css var --el-menu-active-color）	`string \| undefined`	—
`onOpen`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—

实例方法与状态 `AsamMenuExpose`

属性名	说明	类型	默认值
`$`	—	`AsamMenuExpose["$"]`	—
`$data`	—	`AsamTableColumnExpose`	—
`$props`	—	`AsamMenuProps`	—
`$attrs`	—	`AsamMenuExpose["$attrs"]`	—
`$refs`	—	`AsamMenuExpose["$refs"]`	—
`$slots`	—	`AsamAvatarGroupSlots`	—
`$root`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$parent`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$host`	—	`Element \| null`	—
`$emit`	—	`(AsamMenuExpose)["$emit"]`	—
`$el`	—	`any`	—
`$options`	—	`(AsamMenuExpose)["$options"]`	—
`$forceUpdate`	—	`() => void`	—
`$nextTick`	—	`(AsamMenuExpose)["$nextTick"]`	—
`$watch`	—	`(AsamMenuExpose)["$watch"]`	—
`collapse`	—	`boolean`	—
`ellipsis`	—	`(AsamMenuExpose)["ellipsis"]`	—
`mode`	—	`enum"horizontal" \| "vertical"`完整类型：`(AsamMenuExpose)["mode"]`	—
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuExpose)["popperStyle"]`	—
`persistent`	—	`(AsamMenuExpose)["persistent"]`	—
`showTimeout`	—	`number`	—
`hideTimeout`	—	`number`	—
`defaultActive`	—	`string`	—
`defaultOpeneds`	—	`string[]`	—
`menuTrigger`	—	`enum"hover" \| "click"`完整类型：`(AsamMenuExpose)["menuTrigger"]`	—
`collapseTransition`	—	`(AsamMenuExpose)["collapseTransition"]`	—
`popperOffset`	—	`number`	—
`ellipsisIcon`	—	`(AsamMenuExpose)["ellipsisIcon"]`	—
`popperEffect`	—	`enum"light" \| "dark"`完整类型：`(AsamMenuExpose)["popperEffect"]`	—
`uniqueOpened`	—	`boolean`	—
`router`	—	`boolean`	—
`closeOnClickOutside`	—	`boolean`	—
`onSelect`	—	`(AsamMenuExpose)["onSelect"]`	—
`onClose`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—
`backgroundColor`	—	`string \| undefined`	—
`textColor`	—	`string \| undefined`	—
`activeTextColor`	—	`string \| undefined`	—
`onOpen`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—
`$route`	当前规范化路由位置，详见 RouteLocationNormalizedLoaded。	`AsamMenuExpose["$route"]`	—
`$router`	应用使用的 Router 实例。	`AsamMenuExpose["$router"]`	—
`open`	按字符串索引打开已注册子菜单。	`(index: string) => void`	—
`close`	按字符串索引关闭已注册子菜单。	`(index: string) => void`	—
`handleResize`	宿主布局变化后重新计算水平溢出。	`() => void`	—
`updateActiveIndex`	按已注册菜单项及当前回退值设置活动索引。	`(index: string) => void`	—

类型 `AsamMenuInstance`

属性名	说明	类型	默认值
`$`	—	`AsamMenuExpose["$"]`	—
`$data`	—	`AsamTableColumnExpose`	—
`$props`	—	`AsamMenuProps`	—
`$attrs`	—	`AsamMenuExpose["$attrs"]`	—
`$refs`	—	`AsamMenuExpose["$refs"]`	—
`$slots`	—	`AsamAvatarGroupSlots`	—
`$root`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$parent`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$host`	—	`Element \| null`	—
`$emit`	—	`(AsamMenuInstance)["$emit"]`	—
`$el`	—	`any`	—
`$options`	—	`(AsamMenuInstance)["$options"]`	—
`$forceUpdate`	—	`() => void`	—
`$nextTick`	—	`(AsamMenuInstance)["$nextTick"]`	—
`$watch`	—	`(AsamMenuInstance)["$watch"]`	—
`collapse`	—	`boolean`	—
`ellipsis`	—	`(AsamMenuInstance)["ellipsis"]`	—
`mode`	—	`enum"horizontal" \| "vertical"`完整类型：`(AsamMenuInstance)["mode"]`	—
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuInstance)["popperStyle"]`	—
`persistent`	—	`(AsamMenuInstance)["persistent"]`	—
`showTimeout`	—	`number`	—
`hideTimeout`	—	`number`	—
`defaultActive`	—	`string`	—
`defaultOpeneds`	—	`string[]`	—
`menuTrigger`	—	`enum"hover" \| "click"`完整类型：`(AsamMenuInstance)["menuTrigger"]`	—
`collapseTransition`	—	`(AsamMenuInstance)["collapseTransition"]`	—
`popperOffset`	—	`number`	—
`ellipsisIcon`	—	`(AsamMenuInstance)["ellipsisIcon"]`	—
`popperEffect`	—	`enum"light" \| "dark"`完整类型：`(AsamMenuInstance)["popperEffect"]`	—
`uniqueOpened`	—	`boolean`	—
`router`	—	`boolean`	—
`closeOnClickOutside`	—	`boolean`	—
`onSelect`	—	`(AsamMenuInstance)["onSelect"]`	—
`onClose`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—
`backgroundColor`	—	`string \| undefined`	—
`textColor`	—	`string \| undefined`	—
`activeTextColor`	—	`string \| undefined`	—
`onOpen`	—	`((index: string, indexPath: string[]) => any) \| undefined`	—
`$route`	当前规范化路由位置，详见 RouteLocationNormalizedLoaded。	`AsamMenuExpose["$route"]`	—
`$router`	应用使用的 Router 实例。	`AsamMenuExpose["$router"]`	—
`open`	按字符串索引打开已注册子菜单。	`(index: string) => void`	—
`close`	按字符串索引关闭已注册子菜单。	`(index: string) => void`	—
`handleResize`	宿主布局变化后重新计算水平溢出。	`() => void`	—
`updateActiveIndex`	按已注册菜单项及当前回退值设置活动索引。	`(index: string) => void`	—

插槽 `AsamMenuSlots`

属性名	说明	类型	默认值
`default`	菜单项及子菜单。	`Slot \| undefined`	—

事件 `AsamMenuEmits`

属性名	说明	类型	默认值
`close`	—	`(index: string, indexPath: string[]) => boolean`	—
`open`	—	`(index: string, indexPath: string[]) => boolean`	—
`select`	—	`(AsamMenuEmits)["select"]`	—

类型 `AsamMenuItemClicked`

属性名	说明	类型	默认值
`index`	—	`string`	—
`indexPath`	—	`string[]`	—
`route`	—	`(AsamMenuItemClicked)["route"]`	—

类型 `AsamMenuItemEmits`

属性名	说明	类型	默认值
`click`	—	`(item: AsamMenuItemRegistered) => boolean`	—

类型 `AsamMenuItemGroupPropsPublic`

属性名	说明	类型	默认值
`title`	自定义组标题内容	`string \| undefined`	—

类型 `AsamMenuItemPropsPublic`

属性名	说明	类型	默认值
`index`	—	`string`	—
`disabled`	—	`boolean \| undefined`	—
`route`	—	`(AsamMenuItemPropsPublic)["route"]`	—

类型 `AsamMenuItemRegistered`

属性名	说明	类型	默认值
`index`	—	`string`	—
`indexPath`	—	`string[]`	—
`active`	—	`boolean`	—

类型 `AsamMenuPropsPublic`

属性名	说明	类型	默认值
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuPropsPublic)["popperStyle"]`	—
`persistent`	—	`(AsamMenuPropsPublic)["persistent"]`	—
`mode`	—	`enum"horizontal" \| "vertical"`完整类型：`(AsamMenuPropsPublic)["mode"]`	—
`defaultActive`	—	`string \| undefined`	—
`defaultOpeneds`	—	`string[] \| undefined`	—
`uniqueOpened`	—	`boolean \| undefined`	—
`router`	—	`boolean \| undefined`	—
`menuTrigger`	—	`enum"hover" \| "click"`完整类型：`(AsamMenuPropsPublic)["menuTrigger"]`	—
`collapse`	—	`boolean \| undefined`	—
`backgroundColor`	—	`string \| undefined`	—
`textColor`	—	`string \| undefined`	—
`activeTextColor`	—	`string \| undefined`	—
`closeOnClickOutside`	—	`boolean \| undefined`	—
`collapseTransition`	—	`(AsamMenuPropsPublic)["collapseTransition"]`	—
`ellipsis`	—	`(AsamMenuPropsPublic)["ellipsis"]`	—
`popperOffset`	—	`number \| undefined`	—
`ellipsisIcon`	—	`(AsamMenuPropsPublic)["ellipsisIcon"]`	—
`popperEffect`	—	`enum"light" \| "dark"`完整类型：`(AsamMenuPropsPublic)["popperEffect"]`	—
`showTimeout`	—	`number \| undefined`	—
`hideTimeout`	—	`number \| undefined`	—

类型 `AsamMenuProvider`

属性名	说明	类型	默认值
`openedMenus`	—	`string[]`	—
`items`	—	`Record<string, AsamMenuItemRegistered>`	—
`subMenus`	—	`Record<string, AsamMenuItemRegistered>`	—
`activeIndex`	—	`string \| undefined`	—
`isMenuPopup`	—	`boolean`	—
`props`	—	`AsamMenuProvider["props"]`	—
`addMenuItem`	—	`(item: AsamMenuItemRegistered) => void`	—
`removeMenuItem`	—	`(item: AsamMenuItemRegistered) => void`	—
`addSubMenu`	—	`(item: AsamMenuItemRegistered) => void`	—
`removeSubMenu`	—	`(item: AsamMenuItemRegistered) => void`	—
`openMenu`	—	`(index: string, indexPath: string[]) => void`	—
`closeMenu`	—	`(index: string, indexPath: string[]) => void`	—
`handleMenuItemClick`	—	`(item: AsamMenuItemClicked) => void`	—
`handleSubMenuClick`	—	`(subMenu: AsamMenuItemRegistered) => void`	—

类型 `AsamMenuSubMenuInstance`

属性名	说明	类型	默认值
`$`	—	`AsamMenuExpose["$"]`	—
`$data`	—	`AsamTableColumnExpose`	—
`$props`	—	`AsamSubMenuProps`	—
`$attrs`	—	`AsamMenuExpose["$attrs"]`	—
`$refs`	—	`AsamMenuExpose["$refs"]`	—
`$slots`	—	`AsamAvatarGroupSlots`	—
`$root`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$parent`	—	查看完整类型 `ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> \| null`	—
`$host`	—	`Element \| null`	—
`$emit`	—	`(event: string, ...args: any[]) => void`	—
`$el`	—	`any`	—
`$options`	—	`(AsamMenuSubMenuInstance)["$options"]`	—
`$forceUpdate`	—	`() => void`	—
`$nextTick`	—	`(AsamMenuSubMenuInstance)["$nextTick"]`	—
`$watch`	—	`(AsamMenuSubMenuInstance)["$watch"]`	—
`disabled`	—	`boolean`	—
`teleported`	—	`(AsamMenuSubMenuInstance)["teleported"]`	—
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuSubMenuInstance)["popperStyle"]`	—
`popperOffset`	—	`number \| undefined`	—
`showTimeout`	—	`number \| undefined`	—
`hideTimeout`	—	`number \| undefined`	—
`index`	—	`string`	—
`expandCloseIcon`	—	`(AsamMenuSubMenuInstance)["expandCloseIcon"]`	—
`expandOpenIcon`	—	`(AsamMenuSubMenuInstance)["expandOpenIcon"]`	—
`collapseCloseIcon`	—	`(AsamMenuSubMenuInstance)["collapseCloseIcon"]`	—
`collapseOpenIcon`	—	`(AsamMenuSubMenuInstance)["collapseOpenIcon"]`	—
`$route`	当前规范化路由位置，详见 RouteLocationNormalizedLoaded。	`AsamMenuExpose["$route"]`	—
`$router`	应用使用的 Router 实例。	`AsamMenuExpose["$router"]`	—

类型 `AsamMenuSubMenuProps`

属性名	说明	类型	默认值
`disabled`	—	`boolean`	—
`index`	—	`string`	—
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuSubMenuProps)["popperStyle"]`	—
`teleported`	—	`(AsamMenuSubMenuProps)["teleported"]`	—
`popperOffset`	—	`number \| undefined`	—
`showTimeout`	—	`number \| undefined`	—
`hideTimeout`	—	`number \| undefined`	—
`expandCloseIcon`	—	`(AsamMenuSubMenuProps)["expandCloseIcon"]`	—
`expandOpenIcon`	—	`(AsamMenuSubMenuProps)["expandOpenIcon"]`	—
`collapseCloseIcon`	—	`(AsamMenuSubMenuProps)["collapseCloseIcon"]`	—
`collapseOpenIcon`	—	`(AsamMenuSubMenuProps)["collapseOpenIcon"]`	—

类型 `AsamMenuSubMenuPropsPublic`

属性名	说明	类型	默认值
`index`	—	`string`	—
`popperClass`	—	`AsamMenuProps["popperClass"]`	—
`popperStyle`	—	`(AsamMenuSubMenuPropsPublic)["popperStyle"]`	—
`teleported`	—	`(AsamMenuSubMenuPropsPublic)["teleported"]`	—
`disabled`	—	`boolean \| undefined`	—
`popperOffset`	—	`number \| undefined`	—
`showTimeout`	—	`number \| undefined`	—
`hideTimeout`	—	`number \| undefined`	—
`expandCloseIcon`	—	`(AsamMenuSubMenuPropsPublic)["expandCloseIcon"]`	—
`expandOpenIcon`	—	`(AsamMenuSubMenuPropsPublic)["expandOpenIcon"]`	—
`collapseCloseIcon`	—	`(AsamMenuSubMenuPropsPublic)["collapseCloseIcon"]`	—
`collapseOpenIcon`	—	`(AsamMenuSubMenuPropsPublic)["collapseOpenIcon"]`	—

类型 `AsamMenuSubMenuProvider`

属性名	说明	类型	默认值
`addSubMenu`	—	`(item: AsamMenuItemRegistered) => void`	—
`removeSubMenu`	—	`(item: AsamMenuItemRegistered) => void`	—
`handleMouseleave`	—	`((deepDispatch: boolean) => void) \| undefined`	—
`mouseInChild`	—	`Ref<boolean, boolean>`	—
`level`	—	`number`	—

用法与契约补充说明

使用约定

mode、collapse、defaultActive/defaultOpeneds、uniqueOpened、router 和触发策略以公开 Props 配置；select/open/close 反馈实际选择和展开。router 模式需要宿主路由，实例公开打开、关闭和更新方法。示例维护本地选择值，选择后的跳转由宿主处理；菜单项宽高由布局决定。

顶栏

导航菜单默认为垂直模式，通过将 mode 属性设置为 horizontal 来使导航菜单变更为水平模式。另外，在菜单中通过 sub-menu 组件可以生成二级菜单。 Menu 还提供了background-color、text-color和active-text-color，分别用于设置菜单的背景色、菜单的文字颜色和当前激活菜单的文字颜色。

参数与事件补充说明

公开绑定参数，包含具备类型的事件监听器；默认值由运行时定义提供。

参数与事件说明

`collapse`

必填：否；声明来源：上游声明。

collapse 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

false（隐式 Boolean 默认；已安装组件）

固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`ellipsis`

必填：否；声明来源：上游声明。

ellipsis 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

true（已安装运行时；已安装组件）

固定上游文档默认：true（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`mode`

必填：否；声明来源：上游声明。

mode 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："horizontal" / "vertical"

默认值与来源

"vertical"（已安装运行时；已安装组件）

固定上游文档默认：vertical（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：'vertical'（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：否；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

undefined（已安装运行时；已安装组件）

固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：否；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

undefined（已安装运行时；已安装组件）

固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`persistent`

必填：否；声明来源：上游声明。

persistent 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

true（已安装运行时；已安装组件）

固定上游文档默认：true（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`showTimeout`

必填：否；声明来源：上游声明。

默认值与来源

300（已安装运行时；已安装组件）

固定上游文档默认：300（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`hideTimeout`

必填：否；声明来源：上游声明。

默认值与来源

300（已安装运行时；已安装组件）

固定上游文档默认：300（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultActive`

必填：否；声明来源：上游声明。

默认值与来源

""（已安装运行时；已安装组件）

固定上游文档默认：''（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：''（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultOpeneds`

必填：否；声明来源：上游声明。

默认值与来源

工厂函数（每个实例创建）（实例工厂；已安装组件）

固定上游文档默认：[]（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码工厂（未执行）：() => mutable([] as const)（2.14.7；源码事实，未作为 ASAM 运行实测）

`menuTrigger`

必填：否；声明来源：上游声明。

menuTrigger 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："hover" / "click"

默认值与来源

"hover"（已安装运行时；已安装组件）

固定上游文档默认：hover（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：'hover'（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseTransition`

必填：否；声明来源：上游声明。

collapseTransition 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

true（已安装运行时；已安装组件）

固定上游文档默认：true（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：否；声明来源：上游声明。

默认值与来源

6（已安装运行时；已安装组件）

固定上游文档默认：6（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：6（2.14.7；源码事实，未作为 ASAM 运行实测）

`ellipsisIcon`

必填：否；声明来源：上游声明。

ellipsisIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuProps)["ellipsisIcon"]>, (...args: never[]) => unknown>>[1]): any

ellipsisIcon.__isFragment: undefined — 依赖声明
ellipsisIcon.__isTeleport: undefined — 依赖声明
ellipsisIcon.__isSuspense: undefined — 依赖声明

默认值与来源

工厂函数（每个实例创建）（实例工厂；已安装组件）

固定上游文档默认：未声明（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：() => More（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperEffect`

必填：否；声明来源：上游声明。

popperEffect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："light" / "dark"

默认值与来源

"dark"（已安装运行时；已安装组件）

固定上游文档默认：dark（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

固定上游源码默认表达式：'dark'（2.14.7；源码事实，未作为 ASAM 运行实测）

`uniqueOpened`

必填：否；声明来源：上游声明。

uniqueOpened 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

false（隐式 Boolean 默认；已安装组件）

固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`router`

必填：否；声明来源：上游声明。

router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

false（隐式 Boolean 默认；已安装组件）

固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`closeOnClickOutside`

必填：否；声明来源：上游声明。

closeOnClickOutside 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

false（隐式 Boolean 默认；已安装组件）

固定上游文档默认：false（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`style`

必填：否；声明来源：依赖声明。

`onSelect`

必填：否；声明来源：上游声明。

onSelect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[], item: AsamMenuItemClicked, routerResult?: Parameters<Extract<NonNullable<(AsamMenuProps)["onSelect"]>, (...args: never[]) => unknown>>[3]): any

`key`

必填：否；声明来源：依赖声明。

`ref`

必填：否；声明来源：依赖声明。

ref 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(ref: Element | ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null, refs: Record<string, any>): void

ref.value: any — 依赖声明
ref.__@RefSymbol@8854: true — 依赖声明
仅用于区分类型：保留在公开声明中，通过私有 Symbol 避免出现在编辑器自动补全中。
枚举：true

`ref_for`

必填：否；声明来源：依赖声明。

ref_for 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`ref_key`

必填：否；声明来源：依赖声明。

`onVnodeBeforeMount`

必填：否；声明来源：依赖声明。

onVnodeBeforeMount 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`onVnodeMounted`

必填：否；声明来源：依赖声明。

onVnodeMounted 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`onVnodeBeforeUpdate`

必填：否；声明来源：依赖声明。

onVnodeBeforeUpdate 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>, oldVNode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`onVnodeUpdated`

必填：否；声明来源：依赖声明。

onVnodeUpdated 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>, oldVNode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`onVnodeBeforeUnmount`

必填：否；声明来源：依赖声明。

onVnodeBeforeUnmount 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`onVnodeUnmounted`

必填：否；声明来源：依赖声明。

onVnodeUnmounted 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(vnode: VNode<RendererNode, RendererElement, { [key: string]: any; }>): void

`class`

必填：否；声明来源：依赖声明。

`onClose`

必填：否；声明来源：上游声明。

onClose 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

`backgroundColor`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游文档默认：#ffffff（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`textColor`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游文档默认：#303133（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`activeTextColor`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游文档默认：#409eff（2.14.7；文档事实，实际默认以 ASAM 源码 / 安装包为准）

`onOpen`

必填：否；声明来源：上游声明。

onOpen 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

AsamMenuProps 公开类型视图

import type { Component, VNodeRef, ComponentPublicInstance, ComponentOptionsBase, ComponentProvideOptions, VNode, RendererNode, RendererElement } from 'vue';
import type { AsamMenuProps, AsamMenuExpose, AsamMenuItemClicked } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuProps
type PublicContract = {
	readonly "collapse"?: boolean | undefined;
	readonly "ellipsis"?: (AsamMenuProps)["ellipsis"];
	readonly "mode"?: (AsamMenuProps)["mode"];
	readonly "popperClass"?: AsamMenuProps["popperClass"];
	readonly "popperStyle"?: (AsamMenuProps)["popperStyle"];
	readonly "persistent"?: (AsamMenuProps)["persistent"];
	readonly "showTimeout"?: number | undefined;
	readonly "hideTimeout"?: number | undefined;
	readonly "defaultActive"?: string | undefined;
	readonly "defaultOpeneds"?: string[] | undefined;
	readonly "menuTrigger"?: (AsamMenuProps)["menuTrigger"];
	readonly "collapseTransition"?: (AsamMenuProps)["collapseTransition"];
	readonly "popperOffset"?: number | undefined;
	readonly "ellipsisIcon"?: (AsamMenuProps)["ellipsisIcon"];
	readonly "popperEffect"?: (AsamMenuProps)["popperEffect"];
	readonly "uniqueOpened"?: boolean | undefined;
	readonly "router"?: boolean | undefined;
	readonly "closeOnClickOutside"?: boolean | undefined;
	"style"?: unknown;
	readonly "onSelect"?: (AsamMenuProps)["onSelect"];
	"key"?: PropertyKey | undefined;
	"ref"?: VNodeRef | undefined;
	"ref_for"?: boolean | undefined;
	"ref_key"?: string | undefined;
	"onVnodeBeforeMount"?: (AsamMenuProps)["onVnodeBeforeMount"];
	"onVnodeMounted"?: (AsamMenuProps)["onVnodeMounted"];
	"onVnodeBeforeUpdate"?: (AsamMenuProps)["onVnodeBeforeUpdate"];
	"onVnodeUpdated"?: (AsamMenuProps)["onVnodeUpdated"];
	"onVnodeBeforeUnmount"?: (AsamMenuProps)["onVnodeBeforeUnmount"];
	"onVnodeUnmounted"?: (AsamMenuProps)["onVnodeUnmounted"];
	"class"?: unknown;
	readonly "onClose"?: ((index: string, indexPath: string[]) => any) | undefined;
	readonly "backgroundColor"?: string | undefined;
	readonly "textColor"?: string | undefined;
	readonly "activeTextColor"?: string | undefined;
	readonly "onOpen"?: ((index: string, indexPath: string[]) => any) | undefined;
};

完整的上游实例，包含全部公开方法与响应式状态。

参数与事件说明

`$`

必填：是；声明来源：依赖声明。

$ 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$data`

必填：是；声明来源：依赖声明。

`$props`

必填：是；声明来源：依赖声明。

$props 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$attrs`

必填：是；声明来源：依赖声明。

$attrs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$refs`

必填：是；声明来源：依赖声明。

$refs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$slots`

必填：是；声明来源：依赖声明。

$slots 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$root`

必填：是；声明来源：依赖声明。

`$parent`

必填：是；声明来源：依赖声明。

`$host`

必填：是；声明来源：依赖声明。

$host 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：大型实例类型；完整类型见公开类型视图。

`$emit`

必填：是；声明来源：依赖声明。

$emit 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(event: "open", ...args: [index: string, indexPath: string[]]): void

事件参数完整签名见公开类型视图：(AsamMenuExpose)["$emit"]。

事件参数：(event: "close", ...args: [index: string, indexPath: string[]]): void

`$el`

必填：是；声明来源：依赖声明。

`$options`

必填：是；声明来源：依赖声明。

$options 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$forceUpdate`

必填：是；声明来源：依赖声明。

$forceUpdate 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): void

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$nextTick`

必填：是；声明来源：依赖声明。

$nextTick 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): Promise<void>

事件参数：<T, R>(this: T, fn: (this: T) => R | Promise<R>): Promise<R>

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$watch`

必填：是；声明来源：依赖声明。

$watch 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：<T extends string | ((...args: any) => any)>(source: T, cb: Parameters<Extract<NonNullable<(AsamMenuExpose)["$watch"]>, (...args: never[]) => unknown>>[1], options?: WatchOptions<boolean> | undefined): WatchStopHandle

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`collapse`

必填：是；声明来源：上游声明。

collapse 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`ellipsis`

必填：是；声明来源：上游声明。

ellipsis 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`mode`

必填：是；声明来源：上游声明。

mode 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："horizontal" / "vertical"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'vertical'（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：是；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：是；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`persistent`

必填：是；声明来源：上游声明。

persistent 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`showTimeout`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`hideTimeout`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultActive`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：''（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultOpeneds`

必填：是；声明来源：上游声明。

defaultOpeneds 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码工厂（未执行）：() => mutable([] as const)（2.14.7；源码事实，未作为 ASAM 运行实测）

`menuTrigger`

必填：是；声明来源：上游声明。

menuTrigger 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："hover" / "click"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'hover'（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseTransition`

必填：是；声明来源：上游声明。

collapseTransition 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：6（2.14.7；源码事实，未作为 ASAM 运行实测）

`ellipsisIcon`

必填：是；声明来源：上游声明。

ellipsisIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuExpose)["ellipsisIcon"]>, (...args: never[]) => unknown>>[1]): any

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：() => More（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperEffect`

必填：是；声明来源：上游声明。

popperEffect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："light" / "dark"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'dark'（2.14.7；源码事实，未作为 ASAM 运行实测）

`uniqueOpened`

必填：是；声明来源：上游声明。

uniqueOpened 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`router`

必填：是；声明来源：上游声明。

router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`closeOnClickOutside`

必填：是；声明来源：上游声明。

closeOnClickOutside 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`onSelect`

必填：否；声明来源：上游声明。

onSelect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[], item: AsamMenuItemClicked, routerResult?: Parameters<Extract<NonNullable<(AsamMenuExpose)["onSelect"]>, (...args: never[]) => unknown>>[3]): any

`onClose`

必填：否；声明来源：上游声明。

onClose 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

`backgroundColor`

必填：否；声明来源：上游声明。

`textColor`

必填：否；声明来源：上游声明。

`activeTextColor`

必填：否；声明来源：上游声明。

`onOpen`

必填：否；声明来源：上游声明。

onOpen 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

`$route`

必填：是；声明来源：依赖声明。

$route 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$route.matched: (NonNullable<AsamMenuExpose["$route"]>)["matched"] — 依赖声明
仅包含普通组件的 RouteLocationMatched 数组；懒加载组件已解析并替换 components 中的值，可直接展示路由，不包含重定向记录。此属性不可枚举。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$route.name: (NonNullable<AsamMenuExpose["$route"]>)["name"] — 依赖声明
匹配路由记录的名称。
$route.fullPath: string — 依赖声明
包含 search 和 hash 的完整位置字符串，使用百分号编码。
$route.query: (NonNullable<AsamMenuExpose["$route"]>)["query"] — 依赖声明
当前位置 search 属性的对象表示。
$route.hash: string — 依赖声明
当前位置的哈希片段；存在时以 # 开头。
$route.redirectedFrom: (NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"] — 依赖声明
最终到达当前位置之前，最初尝试访问的位置。
- $route.redirectedFrom.matched: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "matched"> — 依赖声明
  包含添加路由时原始组件的 RouteRecord 数组，也可能包含重定向记录，不能直接用于展示。此属性不可枚举。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $route.redirectedFrom.fullPath: string — 依赖声明
  包含 search 和 hash 的完整位置字符串，使用百分号编码。
- $route.redirectedFrom.query: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "query"> — 依赖声明
  当前位置 search 属性的对象表示。
- $route.redirectedFrom.hash: string — 依赖声明
  当前位置的哈希片段；存在时以 # 开头。
- $route.redirectedFrom.redirectedFrom: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "redirectedFrom"> — 依赖声明
  最终到达当前位置之前，最初尝试访问的位置。
  嵌套展开边界：递归引用；完整类型见公开类型视图。
- $route.redirectedFrom.name: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "name"> — 依赖声明
  匹配路由记录的名称。
- $route.redirectedFrom.meta: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "meta"> — 依赖声明
  全部匹配路由记录合并后的 meta 属性。
- $route.redirectedFrom.params: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "params"> — 依赖声明
  从 path 提取并解码后的参数对象。
- $route.redirectedFrom.path: string — 依赖声明
  URL 中经过百分号编码的路径部分。
- $route.redirectedFrom.replace: boolean | undefined — 依赖声明
  替换当前历史记录，而不是添加新记录。
  枚举：false / true
- $route.redirectedFrom.force: boolean | undefined — 依赖声明
  即使目标与当前位置相同，也触发导航；除非传入 replace: true，否则会添加一条历史记录。
  枚举：false / true
- $route.redirectedFrom.state: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "state"> — 依赖声明
  通过 History API 保存的状态；不能包含响应式值，也不允许 Symbol 等部分值。详情参见 https://developer.mozilla.org/zh-CN/docs/Web/API/History/state。
$route.meta: (NonNullable<AsamMenuExpose["$route"]>)["meta"] — 依赖声明
全部匹配路由记录合并后的 meta 属性。
$route.params: (NonNullable<AsamMenuExpose["$route"]>)["params"] — 依赖声明
从 path 提取并解码后的参数对象。
$route.path: string — 依赖声明
URL 中经过百分号编码的路径部分。

`$router`

必填：是；声明来源：依赖声明。

$router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$router.options: (NonNullable<AsamMenuExpose["$router"]>)["options"] — 依赖声明
创建路由器时传入的原始配置对象。
- $router.options.routes: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["routes"] — 依赖声明
  需要添加到路由器的初始路由列表。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $router.options.history: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"] — 依赖声明
  路由器使用的历史记录实现。通常使用 createWebHistory，并配置服务器回退；createWebHashHistory 无需服务器配置，但搜索引擎无法处理其哈希路由，影响搜索优化。
  - $router.options.history.base: string — 依赖声明
    添加到每个 URL 前的基础路径；例如 base 为 /sub-folder 时，可将单页应用部署在域名的对应子目录。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.location: string — 依赖声明
    当前历史记录位置。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.state: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["state"] — 依赖声明
    当前历史记录状态。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.push: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"] — 依赖声明
    导航到指定位置；使用 HTML5 History 时，通过 history.pushState 实际更新 URL。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.replace: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"] — 依赖声明
    与 RouterHistory.push 类似，但调用 history.replaceState，而非 history.pushState。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.go: (delta: number, triggerListeners?: boolean) => void — 依赖声明
    按指定方向遍历历史记录。
    事件参数：(delta: number, triggerListeners?: boolean | undefined): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.listen: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"] — 依赖声明
    为历史记录实现添加监听器；由浏览器前进、后退等外部导航，或传入 true 的 RouterHistory.back、RouterHistory.forward 触发。
    事件参数：(callback: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"]>, (...args: never[]) => unknown>>[0]): () => void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.createHref: (location: AsamMenuExpose["defaultActive"]) => string — 依赖声明
    生成用于链接元素的对应 href。
    事件参数：(location: string): string
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.destroy: () => void — 依赖声明
    清除历史记录实现注册的全部事件监听器。
    事件参数：(): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
- $router.options.scrollBehavior: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"] — 依赖声明
  控制页面导航时滚动行为的函数；可返回 Promise 延迟滚动。
  事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[0], from: AsamMenuExpose["$route"], savedPosition: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[2]): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>
- $router.options.parseQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"] — 依赖声明
  自定义查询参数解析函数；与 EXPERIMENTAL_RouterOptions_Base.stringifyQuery 配套。
  事件参数：(search: string): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"]>, (...args: never[]) => unknown>>
- $router.options.stringifyQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"] — 依赖声明
  自定义查询对象序列化函数；不要添加开头的 ?，与 parseQuery 的解析函数配套。
  事件参数：(query: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"]>, (...args: never[]) => unknown>>[0]): string
- $router.options.linkActiveClass: string | undefined — 依赖声明
  应用于激活 RouterLink 的默认类名；未指定时使用 router-link-active。
- $router.options.linkExactActiveClass: string | undefined — 依赖声明
  应用于精确激活 RouterLink 的默认类名；未指定时使用 router-link-exact-active。
- $router.options.end: boolean | undefined — 依赖声明
  是否在表达式末尾添加 $，使其匹配到路径结尾。
  声明默认：`true`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.sensitive: boolean | undefined — 依赖声明
  使正则表达式区分大小写。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.strict: boolean | undefined — 依赖声明
  是否禁止路径末尾的斜杠。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
$router.addRoute: (NonNullable<AsamMenuExpose["$router"]>)["addRoute"] — 依赖声明
向已有路由添加子路由，或向路由器添加新的 RouteRecordRaw 路由记录。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.removeRoute: (NonNullable<AsamMenuExpose["$router"]>)["removeRoute"] — 依赖声明
按名称移除已有路由。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["removeRoute"]>, (...args: never[]) => unknown>>[0]): void
$router.clearRoutes: () => void — 依赖声明
从路由器中删除全部路由。
事件参数：(): void
$router.currentRoute: ShallowRef<AsamMenuExpose["$route"]> — 依赖声明
当前 RouteLocationNormalized。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$router.listening: boolean — 依赖声明
允许关闭历史事件监听，这是用于微前端的底层 API。
枚举：false / true
$router.hasRoute: (NonNullable<AsamMenuExpose["$router"]>)["hasRoute"] — 依赖声明
检查指定名称的路由是否存在。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["hasRoute"]>, (...args: never[]) => unknown>>[0]): boolean
$router.getRoutes: (NonNullable<AsamMenuExpose["$router"]>)["getRoutes"] — 依赖声明
获取全部 RouteRecord 路由记录的完整列表。
事件参数：(): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["getRoutes"]>, (...args: never[]) => unknown>>
$router.resolve: (NonNullable<AsamMenuExpose["$router"]>)["resolve"] — 依赖声明
返回 RouteLocationRaw 的规范化位置，包含带基础路径的 href；默认使用 router.currentRoute 作为 currentLocation，仅在高级场景中覆盖。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.push: (NonNullable<AsamMenuExpose["$router"]>)["push"] — 依赖声明
通过向历史栈添加记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>
$router.replace: (NonNullable<AsamMenuExpose["$router"]>)["replace"] — 依赖声明
通过替换历史栈中的当前记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>
$router.back: () => void — 依赖声明
通过 history.back() 在可用时后退，等价于 router.go(-1)。
事件参数：(): void
$router.forward: () => void — 依赖声明
通过 history.forward() 在可用时前进，等价于 router.go(1)。
事件参数：(): void
$router.go: (delta: number) => void — 依赖声明
通过调用 history.go() 在历史记录中前进或后退。
事件参数：(delta: number): void
$router.beforeEach: (NonNullable<AsamMenuExpose["$router"]>)["beforeEach"] — 依赖声明
添加每次导航之前执行的守卫，并返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.beforeResolve: (NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"] — 依赖声明
添加导航确认之前执行的守卫，此时组件已获取且其他导航守卫已通过；返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"]>, (...args: never[]) => unknown>>[0]): () => void
$router.afterEach: (NonNullable<AsamMenuExpose["$router"]>)["afterEach"] — 依赖声明
添加每次导航结束后执行的钩子，并返回移除此钩子的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["afterEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.onError: (NonNullable<AsamMenuExpose["$router"]>)["onError"] — 依赖声明
添加导航期间未捕获错误的处理函数，涵盖同步和异步异常、守卫返回或传给 next 的错误，以及路由异步组件解析错误。
事件参数：(handler: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["onError"]>, (...args: never[]) => unknown>>[0]): () => void
$router.isReady: () => Promise<void> — 依赖声明
返回在初次导航完成后兑现的 Promise，此时关联的异步进入钩子与异步组件均已解析；导航已完成时立即兑现。可用于保持服务端与客户端渲染一致；服务端需手动推入初始位置，客户端从 URL 自动读取。
事件参数：(): Promise<void>
$router.install: (app: App) => void — 依赖声明
由 app.use(router) 自动调用，用户不应手动调用；客户端调用时会触发初次导航。
事件参数：(app: App<any>): void

`open`

必填：是；声明来源：ASAM 声明。

open 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

`close`

必填：是；声明来源：ASAM 声明。

close 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

`handleResize`

必填：是；声明来源：ASAM 声明。

handleResize 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): void

`updateActiveIndex`

必填：是；声明来源：ASAM 声明。

updateActiveIndex 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

AsamMenuExpose 公开类型视图

import type { ComponentPublicInstance, ComponentOptionsBase, ComponentProvideOptions, ExtractPropTypes, VNode, RendererNode, RendererElement, ComponentOptionsMixin, GlobalComponents, GlobalDirectives, WatchOptions, WatchStopHandle, Component, ShallowRef, App } from 'vue';
import type { AsamMenuExpose, AsamTableColumnExpose, AsamMenuProps, AsamAvatarGroupSlots, AsamMenuItemClicked } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuExpose
type PublicContract = {
	"$": AsamMenuExpose["$"];
	"$data": AsamTableColumnExpose;
	"$props": AsamMenuProps;
	"$attrs": AsamMenuExpose["$attrs"];
	"$refs": AsamMenuExpose["$refs"];
	"$slots": AsamAvatarGroupSlots;
	"$root": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$parent": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$host": Element | null;
	"$emit": (AsamMenuExpose)["$emit"];
	"$el": any;
	"$options": (AsamMenuExpose)["$options"];
	"$forceUpdate": () => void;
	"$nextTick": (AsamMenuExpose)["$nextTick"];
	"$watch": (AsamMenuExpose)["$watch"];
	readonly "collapse": boolean;
	readonly "ellipsis": (AsamMenuExpose)["ellipsis"];
	readonly "mode": (AsamMenuExpose)["mode"];
	readonly "popperClass": AsamMenuProps["popperClass"];
	readonly "popperStyle": (AsamMenuExpose)["popperStyle"];
	readonly "persistent": (AsamMenuExpose)["persistent"];
	readonly "showTimeout": number;
	readonly "hideTimeout": number;
	readonly "defaultActive": string;
	readonly "defaultOpeneds": string[];
	readonly "menuTrigger": (AsamMenuExpose)["menuTrigger"];
	readonly "collapseTransition": (AsamMenuExpose)["collapseTransition"];
	readonly "popperOffset": number;
	readonly "ellipsisIcon": (AsamMenuExpose)["ellipsisIcon"];
	readonly "popperEffect": (AsamMenuExpose)["popperEffect"];
	readonly "uniqueOpened": boolean;
	readonly "router": boolean;
	readonly "closeOnClickOutside": boolean;
	readonly "onSelect"?: (AsamMenuExpose)["onSelect"];
	readonly "onClose"?: ((index: string, indexPath: string[]) => any) | undefined;
	readonly "backgroundColor"?: string | undefined;
	readonly "textColor"?: string | undefined;
	readonly "activeTextColor"?: string | undefined;
	readonly "onOpen"?: ((index: string, indexPath: string[]) => any) | undefined;
	"$route": AsamMenuExpose["$route"];
	"$router": AsamMenuExpose["$router"];
	"open": (index: string) => void;
	"close": (index: string) => void;
	"handleResize": () => void;
	"updateActiveIndex": (index: string) => void;
};

参数与事件说明

`$`

必填：是；声明来源：依赖声明。

$ 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$data`

必填：是；声明来源：依赖声明。

`$props`

必填：是；声明来源：依赖声明。

$props 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$attrs`

必填：是；声明来源：依赖声明。

$attrs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$refs`

必填：是；声明来源：依赖声明。

$refs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$slots`

必填：是；声明来源：依赖声明。

$slots 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$root`

必填：是；声明来源：依赖声明。

`$parent`

必填：是；声明来源：依赖声明。

`$host`

必填：是；声明来源：依赖声明。

$host 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：大型实例类型；完整类型见公开类型视图。

`$emit`

必填：是；声明来源：依赖声明。

$emit 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(event: "open", ...args: [index: string, indexPath: string[]]): void

事件参数完整签名见公开类型视图：(AsamMenuInstance)["$emit"]。

事件参数：(event: "close", ...args: [index: string, indexPath: string[]]): void

`$el`

必填：是；声明来源：依赖声明。

`$options`

必填：是；声明来源：依赖声明。

$options 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$forceUpdate`

必填：是；声明来源：依赖声明。

$forceUpdate 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): void

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$nextTick`

必填：是；声明来源：依赖声明。

$nextTick 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): Promise<void>

事件参数：<T, R>(this: T, fn: (this: T) => R | Promise<R>): Promise<R>

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$watch`

必填：是；声明来源：依赖声明。

$watch 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：<T extends string | ((...args: any) => any)>(source: T, cb: Parameters<Extract<NonNullable<(AsamMenuInstance)["$watch"]>, (...args: never[]) => unknown>>[1], options?: WatchOptions<boolean> | undefined): WatchStopHandle

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`collapse`

必填：是；声明来源：上游声明。

collapse 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`ellipsis`

必填：是；声明来源：上游声明。

ellipsis 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`mode`

必填：是；声明来源：上游声明。

mode 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："horizontal" / "vertical"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'vertical'（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：是；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：是；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`persistent`

必填：是；声明来源：上游声明。

persistent 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`showTimeout`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`hideTimeout`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultActive`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：''（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultOpeneds`

必填：是；声明来源：上游声明。

defaultOpeneds 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码工厂（未执行）：() => mutable([] as const)（2.14.7；源码事实，未作为 ASAM 运行实测）

`menuTrigger`

必填：是；声明来源：上游声明。

menuTrigger 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："hover" / "click"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'hover'（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseTransition`

必填：是；声明来源：上游声明。

collapseTransition 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：6（2.14.7；源码事实，未作为 ASAM 运行实测）

`ellipsisIcon`

必填：是；声明来源：上游声明。

ellipsisIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuInstance)["ellipsisIcon"]>, (...args: never[]) => unknown>>[1]): any

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：() => More（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperEffect`

必填：是；声明来源：上游声明。

popperEffect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："light" / "dark"

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'dark'（2.14.7；源码事实，未作为 ASAM 运行实测）

`uniqueOpened`

必填：是；声明来源：上游声明。

uniqueOpened 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`router`

必填：是；声明来源：上游声明。

router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`closeOnClickOutside`

必填：是；声明来源：上游声明。

closeOnClickOutside 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`onSelect`

必填：否；声明来源：上游声明。

onSelect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[], item: AsamMenuItemClicked, routerResult?: Parameters<Extract<NonNullable<(AsamMenuInstance)["onSelect"]>, (...args: never[]) => unknown>>[3]): any

`onClose`

必填：否；声明来源：上游声明。

onClose 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

`backgroundColor`

必填：否；声明来源：上游声明。

`textColor`

必填：否；声明来源：上游声明。

`activeTextColor`

必填：否；声明来源：上游声明。

`onOpen`

必填：否；声明来源：上游声明。

onOpen 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): any

`$route`

必填：是；声明来源：依赖声明。

$route 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$route.matched: (NonNullable<AsamMenuExpose["$route"]>)["matched"] — 依赖声明
仅包含普通组件的 RouteLocationMatched 数组；懒加载组件已解析并替换 components 中的值，可直接展示路由，不包含重定向记录。此属性不可枚举。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$route.name: (NonNullable<AsamMenuExpose["$route"]>)["name"] — 依赖声明
匹配路由记录的名称。
$route.fullPath: string — 依赖声明
包含 search 和 hash 的完整位置字符串，使用百分号编码。
$route.query: (NonNullable<AsamMenuExpose["$route"]>)["query"] — 依赖声明
当前位置 search 属性的对象表示。
$route.hash: string — 依赖声明
当前位置的哈希片段；存在时以 # 开头。
$route.redirectedFrom: (NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"] — 依赖声明
最终到达当前位置之前，最初尝试访问的位置。
- $route.redirectedFrom.matched: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "matched"> — 依赖声明
  包含添加路由时原始组件的 RouteRecord 数组，也可能包含重定向记录，不能直接用于展示。此属性不可枚举。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $route.redirectedFrom.fullPath: string — 依赖声明
  包含 search 和 hash 的完整位置字符串，使用百分号编码。
- $route.redirectedFrom.query: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "query"> — 依赖声明
  当前位置 search 属性的对象表示。
- $route.redirectedFrom.hash: string — 依赖声明
  当前位置的哈希片段；存在时以 # 开头。
- $route.redirectedFrom.redirectedFrom: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "redirectedFrom"> — 依赖声明
  最终到达当前位置之前，最初尝试访问的位置。
  嵌套展开边界：递归引用；完整类型见公开类型视图。
- $route.redirectedFrom.name: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "name"> — 依赖声明
  匹配路由记录的名称。
- $route.redirectedFrom.meta: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "meta"> — 依赖声明
  全部匹配路由记录合并后的 meta 属性。
- $route.redirectedFrom.params: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "params"> — 依赖声明
  从 path 提取并解码后的参数对象。
- $route.redirectedFrom.path: string — 依赖声明
  URL 中经过百分号编码的路径部分。
- $route.redirectedFrom.replace: boolean | undefined — 依赖声明
  替换当前历史记录，而不是添加新记录。
  枚举：false / true
- $route.redirectedFrom.force: boolean | undefined — 依赖声明
  即使目标与当前位置相同，也触发导航；除非传入 replace: true，否则会添加一条历史记录。
  枚举：false / true
- $route.redirectedFrom.state: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "state"> — 依赖声明
  通过 History API 保存的状态；不能包含响应式值，也不允许 Symbol 等部分值。详情参见 https://developer.mozilla.org/zh-CN/docs/Web/API/History/state。
$route.meta: (NonNullable<AsamMenuExpose["$route"]>)["meta"] — 依赖声明
全部匹配路由记录合并后的 meta 属性。
$route.params: (NonNullable<AsamMenuExpose["$route"]>)["params"] — 依赖声明
从 path 提取并解码后的参数对象。
$route.path: string — 依赖声明
URL 中经过百分号编码的路径部分。

`$router`

必填：是；声明来源：依赖声明。

$router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$router.options: (NonNullable<AsamMenuExpose["$router"]>)["options"] — 依赖声明
创建路由器时传入的原始配置对象。
- $router.options.routes: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["routes"] — 依赖声明
  需要添加到路由器的初始路由列表。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $router.options.history: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"] — 依赖声明
  路由器使用的历史记录实现。通常使用 createWebHistory，并配置服务器回退；createWebHashHistory 无需服务器配置，但搜索引擎无法处理其哈希路由，影响搜索优化。
  - $router.options.history.base: string — 依赖声明
    添加到每个 URL 前的基础路径；例如 base 为 /sub-folder 时，可将单页应用部署在域名的对应子目录。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.location: string — 依赖声明
    当前历史记录位置。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.state: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["state"] — 依赖声明
    当前历史记录状态。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.push: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"] — 依赖声明
    导航到指定位置；使用 HTML5 History 时，通过 history.pushState 实际更新 URL。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.replace: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"] — 依赖声明
    与 RouterHistory.push 类似，但调用 history.replaceState，而非 history.pushState。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.go: (delta: number, triggerListeners?: boolean) => void — 依赖声明
    按指定方向遍历历史记录。
    事件参数：(delta: number, triggerListeners?: boolean | undefined): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.listen: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"] — 依赖声明
    为历史记录实现添加监听器；由浏览器前进、后退等外部导航，或传入 true 的 RouterHistory.back、RouterHistory.forward 触发。
    事件参数：(callback: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"]>, (...args: never[]) => unknown>>[0]): () => void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.createHref: (location: AsamMenuExpose["defaultActive"]) => string — 依赖声明
    生成用于链接元素的对应 href。
    事件参数：(location: string): string
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.destroy: () => void — 依赖声明
    清除历史记录实现注册的全部事件监听器。
    事件参数：(): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
- $router.options.scrollBehavior: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"] — 依赖声明
  控制页面导航时滚动行为的函数；可返回 Promise 延迟滚动。
  事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[0], from: AsamMenuExpose["$route"], savedPosition: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[2]): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>
- $router.options.parseQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"] — 依赖声明
  自定义查询参数解析函数；与 EXPERIMENTAL_RouterOptions_Base.stringifyQuery 配套。
  事件参数：(search: string): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"]>, (...args: never[]) => unknown>>
- $router.options.stringifyQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"] — 依赖声明
  自定义查询对象序列化函数；不要添加开头的 ?，与 parseQuery 的解析函数配套。
  事件参数：(query: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"]>, (...args: never[]) => unknown>>[0]): string
- $router.options.linkActiveClass: string | undefined — 依赖声明
  应用于激活 RouterLink 的默认类名；未指定时使用 router-link-active。
- $router.options.linkExactActiveClass: string | undefined — 依赖声明
  应用于精确激活 RouterLink 的默认类名；未指定时使用 router-link-exact-active。
- $router.options.end: boolean | undefined — 依赖声明
  是否在表达式末尾添加 $，使其匹配到路径结尾。
  声明默认：`true`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.sensitive: boolean | undefined — 依赖声明
  使正则表达式区分大小写。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.strict: boolean | undefined — 依赖声明
  是否禁止路径末尾的斜杠。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
$router.addRoute: (NonNullable<AsamMenuExpose["$router"]>)["addRoute"] — 依赖声明
向已有路由添加子路由，或向路由器添加新的 RouteRecordRaw 路由记录。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.removeRoute: (NonNullable<AsamMenuExpose["$router"]>)["removeRoute"] — 依赖声明
按名称移除已有路由。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["removeRoute"]>, (...args: never[]) => unknown>>[0]): void
$router.clearRoutes: () => void — 依赖声明
从路由器中删除全部路由。
事件参数：(): void
$router.currentRoute: ShallowRef<AsamMenuExpose["$route"]> — 依赖声明
当前 RouteLocationNormalized。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$router.listening: boolean — 依赖声明
允许关闭历史事件监听，这是用于微前端的底层 API。
枚举：false / true
$router.hasRoute: (NonNullable<AsamMenuExpose["$router"]>)["hasRoute"] — 依赖声明
检查指定名称的路由是否存在。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["hasRoute"]>, (...args: never[]) => unknown>>[0]): boolean
$router.getRoutes: (NonNullable<AsamMenuExpose["$router"]>)["getRoutes"] — 依赖声明
获取全部 RouteRecord 路由记录的完整列表。
事件参数：(): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["getRoutes"]>, (...args: never[]) => unknown>>
$router.resolve: (NonNullable<AsamMenuExpose["$router"]>)["resolve"] — 依赖声明
返回 RouteLocationRaw 的规范化位置，包含带基础路径的 href；默认使用 router.currentRoute 作为 currentLocation，仅在高级场景中覆盖。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.push: (NonNullable<AsamMenuExpose["$router"]>)["push"] — 依赖声明
通过向历史栈添加记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>
$router.replace: (NonNullable<AsamMenuExpose["$router"]>)["replace"] — 依赖声明
通过替换历史栈中的当前记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>
$router.back: () => void — 依赖声明
通过 history.back() 在可用时后退，等价于 router.go(-1)。
事件参数：(): void
$router.forward: () => void — 依赖声明
通过 history.forward() 在可用时前进，等价于 router.go(1)。
事件参数：(): void
$router.go: (delta: number) => void — 依赖声明
通过调用 history.go() 在历史记录中前进或后退。
事件参数：(delta: number): void
$router.beforeEach: (NonNullable<AsamMenuExpose["$router"]>)["beforeEach"] — 依赖声明
添加每次导航之前执行的守卫，并返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.beforeResolve: (NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"] — 依赖声明
添加导航确认之前执行的守卫，此时组件已获取且其他导航守卫已通过；返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"]>, (...args: never[]) => unknown>>[0]): () => void
$router.afterEach: (NonNullable<AsamMenuExpose["$router"]>)["afterEach"] — 依赖声明
添加每次导航结束后执行的钩子，并返回移除此钩子的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["afterEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.onError: (NonNullable<AsamMenuExpose["$router"]>)["onError"] — 依赖声明
添加导航期间未捕获错误的处理函数，涵盖同步和异步异常、守卫返回或传给 next 的错误，以及路由异步组件解析错误。
事件参数：(handler: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["onError"]>, (...args: never[]) => unknown>>[0]): () => void
$router.isReady: () => Promise<void> — 依赖声明
返回在初次导航完成后兑现的 Promise，此时关联的异步进入钩子与异步组件均已解析；导航已完成时立即兑现。可用于保持服务端与客户端渲染一致；服务端需手动推入初始位置，客户端从 URL 自动读取。
事件参数：(): Promise<void>
$router.install: (app: App) => void — 依赖声明
由 app.use(router) 自动调用，用户不应手动调用；客户端调用时会触发初次导航。
事件参数：(app: App<any>): void

`open`

必填：是；声明来源：ASAM 声明。

open 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

`close`

必填：是；声明来源：ASAM 声明。

close 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

`handleResize`

必填：是；声明来源：ASAM 声明。

handleResize 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): void

`updateActiveIndex`

必填：是；声明来源：ASAM 声明。

updateActiveIndex 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string): void

AsamMenuInstance 公开类型视图

import type { ComponentPublicInstance, ComponentOptionsBase, ComponentProvideOptions, ExtractPropTypes, VNode, RendererNode, RendererElement, ComponentOptionsMixin, GlobalComponents, GlobalDirectives, WatchOptions, WatchStopHandle, Component, ShallowRef, App } from 'vue';
import type { AsamMenuInstance, AsamMenuExpose, AsamTableColumnExpose, AsamMenuProps, AsamAvatarGroupSlots, AsamMenuItemClicked } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuInstance
type PublicContract = {
	"$": AsamMenuExpose["$"];
	"$data": AsamTableColumnExpose;
	"$props": AsamMenuProps;
	"$attrs": AsamMenuExpose["$attrs"];
	"$refs": AsamMenuExpose["$refs"];
	"$slots": AsamAvatarGroupSlots;
	"$root": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$parent": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$host": Element | null;
	"$emit": (AsamMenuInstance)["$emit"];
	"$el": any;
	"$options": (AsamMenuInstance)["$options"];
	"$forceUpdate": () => void;
	"$nextTick": (AsamMenuInstance)["$nextTick"];
	"$watch": (AsamMenuInstance)["$watch"];
	readonly "collapse": boolean;
	readonly "ellipsis": (AsamMenuInstance)["ellipsis"];
	readonly "mode": (AsamMenuInstance)["mode"];
	readonly "popperClass": AsamMenuProps["popperClass"];
	readonly "popperStyle": (AsamMenuInstance)["popperStyle"];
	readonly "persistent": (AsamMenuInstance)["persistent"];
	readonly "showTimeout": number;
	readonly "hideTimeout": number;
	readonly "defaultActive": string;
	readonly "defaultOpeneds": string[];
	readonly "menuTrigger": (AsamMenuInstance)["menuTrigger"];
	readonly "collapseTransition": (AsamMenuInstance)["collapseTransition"];
	readonly "popperOffset": number;
	readonly "ellipsisIcon": (AsamMenuInstance)["ellipsisIcon"];
	readonly "popperEffect": (AsamMenuInstance)["popperEffect"];
	readonly "uniqueOpened": boolean;
	readonly "router": boolean;
	readonly "closeOnClickOutside": boolean;
	readonly "onSelect"?: (AsamMenuInstance)["onSelect"];
	readonly "onClose"?: ((index: string, indexPath: string[]) => any) | undefined;
	readonly "backgroundColor"?: string | undefined;
	readonly "textColor"?: string | undefined;
	readonly "activeTextColor"?: string | undefined;
	readonly "onOpen"?: ((index: string, indexPath: string[]) => any) | undefined;
	"$route": AsamMenuExpose["$route"];
	"$router": AsamMenuExpose["$router"];
	"open": (index: string) => void;
	"close": (index: string) => void;
	"handleResize": () => void;
	"updateActiveIndex": (index: string) => void;
};

作用域插槽保留上游实例契约。

参数与事件说明

`default`

必填：否；声明来源：ASAM 声明。

default 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(...args: any[]): VNode<RendererNode, RendererElement, { [key: string]: any; }>[]

AsamMenuSlots 公开类型视图

import type { Slot, VNode, RendererNode, RendererElement } from 'vue';
import type { AsamMenuSlots } from '@asam-ui/ui';

// AsamMenuSlots
type PublicContract = {
	"default"?: Slot | undefined;
	readonly [key: string]: Slot<any> | undefined;
};

参数与事件说明

`close`

必填：是；声明来源：上游声明。

close 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): boolean

`open`

必填：是；声明来源：上游声明。

open 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): boolean

`select`

必填：是；声明来源：上游声明。

select 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[], item: AsamMenuItemClicked, routerResult?: Parameters<Extract<NonNullable<(AsamMenuEmits)["select"]>, (...args: never[]) => unknown>>[3]): boolean

AsamMenuEmits 公开类型视图

import type { AsamMenuEmits, AsamMenuExpose, AsamMenuItemClicked } from '@asam-ui/ui';

// AsamMenuEmits
type PublicContract = {
	"close": (index: string, indexPath: string[]) => boolean;
	"open": (index: string, indexPath: string[]) => boolean;
	"select": (AsamMenuEmits)["select"];
};

参数与事件说明

`index`

必填：是；声明来源：上游声明。

`indexPath`

必填：是；声明来源：上游声明。

indexPath 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`route`

必填：否；声明来源：上游声明。

route 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

route.name: PublicMember<NonNullable<(AsamMenuItemClicked)["route"]>, "name"> — 依赖声明
route.params: PublicMember<NonNullable<(AsamMenuItemClicked)["route"]>, "params"> — 依赖声明
route.path: undefined — 依赖声明
相对于当前位置的路径；此属性应移除。
route.query: PublicMember<NonNullable<(AsamMenuItemClicked)["route"]>, "query"> — 依赖声明
route.hash: string | undefined — 依赖声明
route.replace: boolean | undefined — 依赖声明
替换当前历史记录，而不是添加新记录。
枚举：false / true
route.force: boolean | undefined — 依赖声明
即使目标与当前位置相同，也触发导航；除非传入 replace: true，否则会添加一条历史记录。
枚举：false / true
route.state: PublicMember<NonNullable<(AsamMenuItemClicked)["route"]>, "state"> — 依赖声明
通过 History API 保存的状态；不能包含响应式值，也不允许 Symbol 等部分值。详情参见 https://developer.mozilla.org/zh-CN/docs/Web/API/History/state。
route.path: string — 依赖声明
URL 中经过百分号编码的路径部分。

AsamMenuItemClicked 公开类型视图

import type { AsamMenuItemClicked, AsamMenuExpose, AsamMenuItemProps, AsamMenuProps } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuItemClicked
type PublicContract = {
	"index": string;
	"indexPath": string[];
	"route"?: (AsamMenuItemClicked)["route"];
};

参数与事件说明

`click`

必填：是；声明来源：上游声明。

click 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): boolean

AsamMenuItemEmits 公开类型视图

import type { AsamMenuItemEmits, AsamMenuItemRegistered } from '@asam-ui/ui';

// AsamMenuItemEmits
type PublicContract = {
	"click": (item: AsamMenuItemRegistered) => boolean;
};

参数与事件说明

`title`

必填：否；声明来源：上游声明。

AsamMenuItemGroupPropsPublic 公开类型视图

import type { AsamMenuItemGroupPropsPublic, AsamMenuProps } from '@asam-ui/ui';

// AsamMenuItemGroupPropsPublic
type PublicContract = {
	readonly "title"?: string | undefined;
};

参数与事件说明

`index`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`disabled`

必填：否；声明来源：上游声明。

disabled 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`route`

必填：否；声明来源：上游声明。

route 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

route.name: PublicMember<NonNullable<(AsamMenuItemPropsPublic)["route"]>, "name"> — 依赖声明
route.params: PublicMember<NonNullable<(AsamMenuItemPropsPublic)["route"]>, "params"> — 依赖声明
route.path: undefined — 依赖声明
相对于当前位置的路径；此属性应移除。
route.query: PublicMember<NonNullable<(AsamMenuItemPropsPublic)["route"]>, "query"> — 依赖声明
route.hash: string | undefined — 依赖声明
route.replace: boolean | undefined — 依赖声明
替换当前历史记录，而不是添加新记录。
枚举：false / true
route.force: boolean | undefined — 依赖声明
即使目标与当前位置相同，也触发导航；除非传入 replace: true，否则会添加一条历史记录。
枚举：false / true
route.state: PublicMember<NonNullable<(AsamMenuItemPropsPublic)["route"]>, "state"> — 依赖声明
通过 History API 保存的状态；不能包含响应式值，也不允许 Symbol 等部分值。详情参见 https://developer.mozilla.org/zh-CN/docs/Web/API/History/state。
route.path: string — 依赖声明
URL 中经过百分号编码的路径部分。

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

AsamMenuItemPropsPublic 公开类型视图

import type { AsamMenuItemPropsPublic, AsamMenuExpose, AsamMenuProps } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuItemPropsPublic
type PublicContract = {
	readonly "index": string;
	readonly "disabled"?: boolean | undefined;
	readonly "route"?: (AsamMenuItemPropsPublic)["route"];
};

参数与事件说明

`index`

必填：是；声明来源：上游声明。

`indexPath`

必填：是；声明来源：上游声明。

indexPath 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`active`

必填：是；声明来源：上游声明。

active 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

AsamMenuItemRegistered 公开类型视图

import type { AsamMenuItemRegistered, AsamMenuExpose } from '@asam-ui/ui';

// AsamMenuItemRegistered
type PublicContract = {
	"index": string;
	"indexPath": string[];
	"active": boolean;
};

参数与事件说明

`popperClass`

必填：否；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：否；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`persistent`

必填：否；声明来源：上游声明。

persistent 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`mode`

必填：否；声明来源：上游声明。

mode 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："horizontal" / "vertical"

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'vertical'（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultActive`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：''（2.14.7；源码事实，未作为 ASAM 运行实测）

`defaultOpeneds`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码工厂（未执行）：() => mutable([] as const)（2.14.7；源码事实，未作为 ASAM 运行实测）

`uniqueOpened`

必填：否；声明来源：上游声明。

uniqueOpened 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`router`

必填：否；声明来源：上游声明。

router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`menuTrigger`

必填：否；声明来源：上游声明。

menuTrigger 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："hover" / "click"

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'hover'（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapse`

必填：否；声明来源：上游声明。

collapse 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`backgroundColor`

必填：否；声明来源：上游声明。

`textColor`

必填：否；声明来源：上游声明。

`activeTextColor`

必填：否；声明来源：上游声明。

`closeOnClickOutside`

必填：否；声明来源：上游声明。

closeOnClickOutside 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`collapseTransition`

必填：否；声明来源：上游声明。

collapseTransition 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`ellipsis`

必填：否；声明来源：上游声明。

ellipsis 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

未知 / 未声明

固定上游源码默认表达式：true（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：6（2.14.7；源码事实，未作为 ASAM 运行实测）

`ellipsisIcon`

必填：否；声明来源：上游声明。

ellipsisIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuPropsPublic)["ellipsisIcon"]>, (...args: never[]) => unknown>>[1]): any

ellipsisIcon.__isFragment: undefined — 依赖声明
ellipsisIcon.__isTeleport: undefined — 依赖声明
ellipsisIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码默认表达式：() => More（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperEffect`

必填：否；声明来源：上游声明。

popperEffect 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举："light" / "dark"

默认值与来源

未知 / 未声明

固定上游源码默认表达式：'dark'（2.14.7；源码事实，未作为 ASAM 运行实测）

`showTimeout`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

`hideTimeout`

必填：否；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：300（2.14.7；源码事实，未作为 ASAM 运行实测）

AsamMenuPropsPublic 公开类型视图

import type { Component } from 'vue';
import type { AsamMenuPropsPublic, AsamMenuProps, AsamMenuExpose } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuPropsPublic
type PublicContract = {
	readonly "popperClass"?: AsamMenuProps["popperClass"];
	readonly "popperStyle"?: (AsamMenuPropsPublic)["popperStyle"];
	readonly "persistent"?: (AsamMenuPropsPublic)["persistent"];
	readonly "mode"?: (AsamMenuPropsPublic)["mode"];
	readonly "defaultActive"?: string | undefined;
	readonly "defaultOpeneds"?: string[] | undefined;
	readonly "uniqueOpened"?: boolean | undefined;
	readonly "router"?: boolean | undefined;
	readonly "menuTrigger"?: (AsamMenuPropsPublic)["menuTrigger"];
	readonly "collapse"?: boolean | undefined;
	readonly "backgroundColor"?: string | undefined;
	readonly "textColor"?: string | undefined;
	readonly "activeTextColor"?: string | undefined;
	readonly "closeOnClickOutside"?: boolean | undefined;
	readonly "collapseTransition"?: (AsamMenuPropsPublic)["collapseTransition"];
	readonly "ellipsis"?: (AsamMenuPropsPublic)["ellipsis"];
	readonly "popperOffset"?: number | undefined;
	readonly "ellipsisIcon"?: (AsamMenuPropsPublic)["ellipsisIcon"];
	readonly "popperEffect"?: (AsamMenuPropsPublic)["popperEffect"];
	readonly "showTimeout"?: number | undefined;
	readonly "hideTimeout"?: number | undefined;
};

参数与事件说明

`openedMenus`

必填：是；声明来源：上游声明。

openedMenus 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`items`

必填：是；声明来源：上游声明。

items 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`subMenus`

必填：是；声明来源：上游声明。

subMenus 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`activeIndex`

必填：否；声明来源：上游声明。

`isMenuPopup`

必填：是；声明来源：上游声明。

isMenuPopup 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`props`

必填：是；声明来源：上游声明。

`addMenuItem`

必填：是；声明来源：上游声明。

addMenuItem 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`removeMenuItem`

必填：是；声明来源：上游声明。

removeMenuItem 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`addSubMenu`

必填：是；声明来源：上游声明。

addSubMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`removeSubMenu`

必填：是；声明来源：上游声明。

removeSubMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`openMenu`

必填：是；声明来源：上游声明。

openMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): void

`closeMenu`

必填：是；声明来源：上游声明。

closeMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(index: string, indexPath: string[]): void

`handleMenuItemClick`

必填：是；声明来源：上游声明。

handleMenuItemClick 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemClicked): void

`handleSubMenuClick`

必填：是；声明来源：上游声明。

handleSubMenuClick 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(subMenu: AsamMenuItemRegistered): void

AsamMenuProvider 公开类型视图

import type { AsamMenuProvider, AsamMenuExpose, AsamMenuItemRegistered, AsamMenuProps, AsamMenuItemClicked } from '@asam-ui/ui';

// AsamMenuProvider
type PublicContract = {
	"openedMenus": string[];
	"items": Record<string, AsamMenuItemRegistered>;
	"subMenus": Record<string, AsamMenuItemRegistered>;
	"activeIndex"?: string | undefined;
	"isMenuPopup": boolean;
	"props": AsamMenuProvider["props"];
	"addMenuItem": (item: AsamMenuItemRegistered) => void;
	"removeMenuItem": (item: AsamMenuItemRegistered) => void;
	"addSubMenu": (item: AsamMenuItemRegistered) => void;
	"removeSubMenu": (item: AsamMenuItemRegistered) => void;
	"openMenu": (index: string, indexPath: string[]) => void;
	"closeMenu": (index: string, indexPath: string[]) => void;
	"handleMenuItemClick": (item: AsamMenuItemClicked) => void;
	"handleSubMenuClick": (subMenu: AsamMenuItemRegistered) => void;
};

参数与事件说明

`$`

必填：是；声明来源：依赖声明。

$ 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$data`

必填：是；声明来源：依赖声明。

`$props`

必填：是；声明来源：依赖声明。

$props 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$attrs`

必填：是；声明来源：依赖声明。

$attrs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$refs`

必填：是；声明来源：依赖声明。

$refs 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$slots`

必填：是；声明来源：依赖声明。

$slots 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$root`

必填：是；声明来源：依赖声明。

`$parent`

必填：是；声明来源：依赖声明。

`$host`

必填：是；声明来源：依赖声明。

$host 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：大型实例类型；完整类型见公开类型视图。

`$emit`

必填：是；声明来源：依赖声明。

$emit 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(event: string, ...args: any[]): void

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$el`

必填：是；声明来源：依赖声明。

`$options`

必填：是；声明来源：依赖声明。

$options 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：复杂类型；完整类型见公开类型视图。

`$forceUpdate`

必填：是；声明来源：依赖声明。

$forceUpdate 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): void

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$nextTick`

必填：是；声明来源：依赖声明。

$nextTick 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(): Promise<void>

事件参数：<T, R>(this: T, fn: (this: T) => R | Promise<R>): Promise<R>

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`$watch`

必填：是；声明来源：依赖声明。

$watch 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：<T extends string | ((...args: any) => any)>(source: T, cb: Parameters<Extract<NonNullable<(AsamMenuSubMenuInstance)["$watch"]>, (...args: never[]) => unknown>>[1], options?: WatchOptions<boolean> | undefined): WatchStopHandle

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`disabled`

必填：是；声明来源：上游声明。

disabled 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`teleported`

必填：是；声明来源：上游声明。

teleported 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：是；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：是；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：否；声明来源：上游声明。

`showTimeout`

必填：否；声明来源：上游声明。

`hideTimeout`

必填：否；声明来源：上游声明。

`index`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`expandCloseIcon`

必填：否；声明来源：上游声明。

expandCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuInstance)["expandCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

expandCloseIcon.__isFragment: undefined — 依赖声明
expandCloseIcon.__isTeleport: undefined — 依赖声明
expandCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`expandOpenIcon`

必填：否；声明来源：上游声明。

expandOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuInstance)["expandOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

expandOpenIcon.__isFragment: undefined — 依赖声明
expandOpenIcon.__isTeleport: undefined — 依赖声明
expandOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseCloseIcon`

必填：否；声明来源：上游声明。

collapseCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuInstance)["collapseCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseCloseIcon.__isFragment: undefined — 依赖声明
collapseCloseIcon.__isTeleport: undefined — 依赖声明
collapseCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseOpenIcon`

必填：否；声明来源：上游声明。

collapseOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuInstance)["collapseOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseOpenIcon.__isFragment: undefined — 依赖声明
collapseOpenIcon.__isTeleport: undefined — 依赖声明
collapseOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`$route`

必填：是；声明来源：依赖声明。

$route 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$route.matched: (NonNullable<AsamMenuExpose["$route"]>)["matched"] — 依赖声明
仅包含普通组件的 RouteLocationMatched 数组；懒加载组件已解析并替换 components 中的值，可直接展示路由，不包含重定向记录。此属性不可枚举。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$route.name: (NonNullable<AsamMenuExpose["$route"]>)["name"] — 依赖声明
匹配路由记录的名称。
$route.fullPath: string — 依赖声明
包含 search 和 hash 的完整位置字符串，使用百分号编码。
$route.query: (NonNullable<AsamMenuExpose["$route"]>)["query"] — 依赖声明
当前位置 search 属性的对象表示。
$route.hash: string — 依赖声明
当前位置的哈希片段；存在时以 # 开头。
$route.redirectedFrom: (NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"] — 依赖声明
最终到达当前位置之前，最初尝试访问的位置。
- $route.redirectedFrom.matched: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "matched"> — 依赖声明
  包含添加路由时原始组件的 RouteRecord 数组，也可能包含重定向记录，不能直接用于展示。此属性不可枚举。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $route.redirectedFrom.fullPath: string — 依赖声明
  包含 search 和 hash 的完整位置字符串，使用百分号编码。
- $route.redirectedFrom.query: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "query"> — 依赖声明
  当前位置 search 属性的对象表示。
- $route.redirectedFrom.hash: string — 依赖声明
  当前位置的哈希片段；存在时以 # 开头。
- $route.redirectedFrom.redirectedFrom: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "redirectedFrom"> — 依赖声明
  最终到达当前位置之前，最初尝试访问的位置。
  嵌套展开边界：递归引用；完整类型见公开类型视图。
- $route.redirectedFrom.name: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "name"> — 依赖声明
  匹配路由记录的名称。
- $route.redirectedFrom.meta: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "meta"> — 依赖声明
  全部匹配路由记录合并后的 meta 属性。
- $route.redirectedFrom.params: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "params"> — 依赖声明
  从 path 提取并解码后的参数对象。
- $route.redirectedFrom.path: string — 依赖声明
  URL 中经过百分号编码的路径部分。
- $route.redirectedFrom.replace: boolean | undefined — 依赖声明
  替换当前历史记录，而不是添加新记录。
  枚举：false / true
- $route.redirectedFrom.force: boolean | undefined — 依赖声明
  即使目标与当前位置相同，也触发导航；除非传入 replace: true，否则会添加一条历史记录。
  枚举：false / true
- $route.redirectedFrom.state: PublicMember<NonNullable<(NonNullable<AsamMenuExpose["$route"]>)["redirectedFrom"]>, "state"> — 依赖声明
  通过 History API 保存的状态；不能包含响应式值，也不允许 Symbol 等部分值。详情参见 https://developer.mozilla.org/zh-CN/docs/Web/API/History/state。
$route.meta: (NonNullable<AsamMenuExpose["$route"]>)["meta"] — 依赖声明
全部匹配路由记录合并后的 meta 属性。
$route.params: (NonNullable<AsamMenuExpose["$route"]>)["params"] — 依赖声明
从 path 提取并解码后的参数对象。
$route.path: string — 依赖声明
URL 中经过百分号编码的路径部分。

`$router`

必填：是；声明来源：依赖声明。

$router 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

$router.options: (NonNullable<AsamMenuExpose["$router"]>)["options"] — 依赖声明
创建路由器时传入的原始配置对象。
- $router.options.routes: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["routes"] — 依赖声明
  需要添加到路由器的初始路由列表。
  嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
- $router.options.history: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"] — 依赖声明
  路由器使用的历史记录实现。通常使用 createWebHistory，并配置服务器回退；createWebHashHistory 无需服务器配置，但搜索引擎无法处理其哈希路由，影响搜索优化。
  - $router.options.history.base: string — 依赖声明
    添加到每个 URL 前的基础路径；例如 base 为 /sub-folder 时，可将单页应用部署在域名的对应子目录。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.location: string — 依赖声明
    当前历史记录位置。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.state: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["state"] — 依赖声明
    当前历史记录状态。
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.push: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"] — 依赖声明
    导航到指定位置；使用 HTML5 History 时，通过 history.pushState 实际更新 URL。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["push"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.replace: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"] — 依赖声明
    与 RouterHistory.push 类似，但调用 history.replaceState，而非 history.pushState。
    事件参数：(to: string, data?: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["replace"]>, (...args: never[]) => unknown>>[1]): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.go: (delta: number, triggerListeners?: boolean) => void — 依赖声明
    按指定方向遍历历史记录。
    事件参数：(delta: number, triggerListeners?: boolean | undefined): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.listen: (NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"] — 依赖声明
    为历史记录实现添加监听器；由浏览器前进、后退等外部导航，或传入 true 的 RouterHistory.back、RouterHistory.forward 触发。
    事件参数：(callback: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["history"]>)["listen"]>, (...args: never[]) => unknown>>[0]): () => void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.createHref: (location: AsamMenuExpose["defaultActive"]) => string — 依赖声明
    生成用于链接元素的对应 href。
    事件参数：(location: string): string
    嵌套展开边界：深度上限；完整类型见公开类型视图。
  - $router.options.history.destroy: () => void — 依赖声明
    清除历史记录实现注册的全部事件监听器。
    事件参数：(): void
    嵌套展开边界：深度上限；完整类型见公开类型视图。
- $router.options.scrollBehavior: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"] — 依赖声明
  控制页面导航时滚动行为的函数；可返回 Promise 延迟滚动。
  事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[0], from: AsamMenuExpose["$route"], savedPosition: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>[2]): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["scrollBehavior"]>, (...args: never[]) => unknown>>
- $router.options.parseQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"] — 依赖声明
  自定义查询参数解析函数；与 EXPERIMENTAL_RouterOptions_Base.stringifyQuery 配套。
  事件参数：(search: string): ReturnType<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["parseQuery"]>, (...args: never[]) => unknown>>
- $router.options.stringifyQuery: (NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"] — 依赖声明
  自定义查询对象序列化函数；不要添加开头的 ?，与 parseQuery 的解析函数配套。
  事件参数：(query: Parameters<Extract<NonNullable<(NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["options"]>)["stringifyQuery"]>, (...args: never[]) => unknown>>[0]): string
- $router.options.linkActiveClass: string | undefined — 依赖声明
  应用于激活 RouterLink 的默认类名；未指定时使用 router-link-active。
- $router.options.linkExactActiveClass: string | undefined — 依赖声明
  应用于精确激活 RouterLink 的默认类名；未指定时使用 router-link-exact-active。
- $router.options.end: boolean | undefined — 依赖声明
  是否在表达式末尾添加 $，使其匹配到路径结尾。
  声明默认：`true`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.sensitive: boolean | undefined — 依赖声明
  使正则表达式区分大小写。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
- $router.options.strict: boolean | undefined — 依赖声明
  是否禁止路径末尾的斜杠。
  声明默认：`false`（注释，实际运行默认以源码/安装包为准）
  枚举：false / true
$router.addRoute: (NonNullable<AsamMenuExpose["$router"]>)["addRoute"] — 依赖声明
向已有路由添加子路由，或向路由器添加新的 RouteRecordRaw 路由记录。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.removeRoute: (NonNullable<AsamMenuExpose["$router"]>)["removeRoute"] — 依赖声明
按名称移除已有路由。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["removeRoute"]>, (...args: never[]) => unknown>>[0]): void
$router.clearRoutes: () => void — 依赖声明
从路由器中删除全部路由。
事件参数：(): void
$router.currentRoute: ShallowRef<AsamMenuExpose["$route"]> — 依赖声明
当前 RouteLocationNormalized。
嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。
$router.listening: boolean — 依赖声明
允许关闭历史事件监听，这是用于微前端的底层 API。
枚举：false / true
$router.hasRoute: (NonNullable<AsamMenuExpose["$router"]>)["hasRoute"] — 依赖声明
检查指定名称的路由是否存在。
事件参数：(name: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["hasRoute"]>, (...args: never[]) => unknown>>[0]): boolean
$router.getRoutes: (NonNullable<AsamMenuExpose["$router"]>)["getRoutes"] — 依赖声明
获取全部 RouteRecord 路由记录的完整列表。
事件参数：(): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["getRoutes"]>, (...args: never[]) => unknown>>
$router.resolve: (NonNullable<AsamMenuExpose["$router"]>)["resolve"] — 依赖声明
返回 RouteLocationRaw 的规范化位置，包含带基础路径的 href；默认使用 router.currentRoute 作为 currentLocation，仅在高级场景中覆盖。
事件参数完整签名见公开类型视图。
事件参数完整签名见公开类型视图。
$router.push: (NonNullable<AsamMenuExpose["$router"]>)["push"] — 依赖声明
通过向历史栈添加记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["push"]>, (...args: never[]) => unknown>>
$router.replace: (NonNullable<AsamMenuExpose["$router"]>)["replace"] — 依赖声明
通过替换历史栈中的当前记录，以编程方式导航到新 URL。
事件参数：(to: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>[0]): ReturnType<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["replace"]>, (...args: never[]) => unknown>>
$router.back: () => void — 依赖声明
通过 history.back() 在可用时后退，等价于 router.go(-1)。
事件参数：(): void
$router.forward: () => void — 依赖声明
通过 history.forward() 在可用时前进，等价于 router.go(1)。
事件参数：(): void
$router.go: (delta: number) => void — 依赖声明
通过调用 history.go() 在历史记录中前进或后退。
事件参数：(delta: number): void
$router.beforeEach: (NonNullable<AsamMenuExpose["$router"]>)["beforeEach"] — 依赖声明
添加每次导航之前执行的守卫，并返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.beforeResolve: (NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"] — 依赖声明
添加导航确认之前执行的守卫，此时组件已获取且其他导航守卫已通过；返回移除此守卫的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["beforeResolve"]>, (...args: never[]) => unknown>>[0]): () => void
$router.afterEach: (NonNullable<AsamMenuExpose["$router"]>)["afterEach"] — 依赖声明
添加每次导航结束后执行的钩子，并返回移除此钩子的函数。
事件参数：(guard: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["afterEach"]>, (...args: never[]) => unknown>>[0]): () => void
$router.onError: (NonNullable<AsamMenuExpose["$router"]>)["onError"] — 依赖声明
添加导航期间未捕获错误的处理函数，涵盖同步和异步异常、守卫返回或传给 next 的错误，以及路由异步组件解析错误。
事件参数：(handler: Parameters<Extract<NonNullable<(NonNullable<AsamMenuExpose["$router"]>)["onError"]>, (...args: never[]) => unknown>>[0]): () => void
$router.isReady: () => Promise<void> — 依赖声明
返回在初次导航完成后兑现的 Promise，此时关联的异步进入钩子与异步组件均已解析；导航已完成时立即兑现。可用于保持服务端与客户端渲染一致；服务端需手动推入初始位置，客户端从 URL 自动读取。
事件参数：(): Promise<void>
$router.install: (app: App) => void — 依赖声明
由 app.use(router) 自动调用，用户不应手动调用；客户端调用时会触发初次导航。
事件参数：(app: App<any>): void

AsamMenuSubMenuInstance 公开类型视图

import type { ComponentPublicInstance, ComponentOptionsBase, ComponentProvideOptions, ExtractPropTypes, PropType, VNode, RendererNode, RendererElement, ComponentOptionsMixin, GlobalComponents, GlobalDirectives, WatchOptions, WatchStopHandle, ShallowRef, App } from 'vue';
import type { AsamMenuSubMenuInstance, AsamMenuExpose, AsamTableColumnExpose, AsamSubMenuProps, AsamAvatarGroupSlots, AsamMenuItemGroupExpose, AsamMenuProps } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuSubMenuInstance
type PublicContract = {
	"$": AsamMenuExpose["$"];
	"$data": AsamTableColumnExpose;
	"$props": AsamSubMenuProps;
	"$attrs": AsamMenuExpose["$attrs"];
	"$refs": AsamMenuExpose["$refs"];
	"$slots": AsamAvatarGroupSlots;
	"$root": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$parent": ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}, {}, {}, string, ComponentProvideOptions>, {}, {}, "", {}, any> | null;
	"$host": Element | null;
	"$emit": (event: string, ...args: any[]) => void;
	"$el": any;
	"$options": (AsamMenuSubMenuInstance)["$options"];
	"$forceUpdate": () => void;
	"$nextTick": (AsamMenuSubMenuInstance)["$nextTick"];
	"$watch": (AsamMenuSubMenuInstance)["$watch"];
	readonly "disabled": boolean;
	readonly "teleported": (AsamMenuSubMenuInstance)["teleported"];
	readonly "popperClass": AsamMenuProps["popperClass"];
	readonly "popperStyle": (AsamMenuSubMenuInstance)["popperStyle"];
	readonly "popperOffset"?: number | undefined;
	readonly "showTimeout"?: number | undefined;
	readonly "hideTimeout"?: number | undefined;
	readonly "index": string;
	readonly "expandCloseIcon"?: (AsamMenuSubMenuInstance)["expandCloseIcon"];
	readonly "expandOpenIcon"?: (AsamMenuSubMenuInstance)["expandOpenIcon"];
	readonly "collapseCloseIcon"?: (AsamMenuSubMenuInstance)["collapseCloseIcon"];
	readonly "collapseOpenIcon"?: (AsamMenuSubMenuInstance)["collapseOpenIcon"];
	"$route": AsamMenuExpose["$route"];
	"$router": AsamMenuExpose["$router"];
};

参数与事件说明

`disabled`

必填：是；声明来源：上游声明。

disabled 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`index`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：否；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：否；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`teleported`

必填：否；声明来源：上游声明。

teleported 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperOffset`

必填：否；声明来源：上游声明。

`showTimeout`

必填：否；声明来源：上游声明。

`hideTimeout`

必填：否；声明来源：上游声明。

`expandCloseIcon`

必填：否；声明来源：上游声明。

expandCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuProps)["expandCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

expandCloseIcon.__isFragment: undefined — 依赖声明
expandCloseIcon.__isTeleport: undefined — 依赖声明
expandCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`expandOpenIcon`

必填：否；声明来源：上游声明。

expandOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuProps)["expandOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

expandOpenIcon.__isFragment: undefined — 依赖声明
expandOpenIcon.__isTeleport: undefined — 依赖声明
expandOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseCloseIcon`

必填：否；声明来源：上游声明。

collapseCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuProps)["collapseCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseCloseIcon.__isFragment: undefined — 依赖声明
collapseCloseIcon.__isTeleport: undefined — 依赖声明
collapseCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseOpenIcon`

必填：否；声明来源：上游声明。

collapseOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuProps)["collapseOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseOpenIcon.__isFragment: undefined — 依赖声明
collapseOpenIcon.__isTeleport: undefined — 依赖声明
collapseOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

AsamMenuSubMenuProps 公开类型视图

import type { AsamMenuSubMenuProps, AsamMenuExpose, AsamMenuProps } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuSubMenuProps
type PublicContract = {
	readonly "disabled": boolean;
	readonly "index": string;
	readonly "popperClass"?: AsamMenuProps["popperClass"];
	readonly "popperStyle"?: (AsamMenuSubMenuProps)["popperStyle"];
	readonly "teleported"?: (AsamMenuSubMenuProps)["teleported"];
	readonly "popperOffset"?: number | undefined;
	readonly "showTimeout"?: number | undefined;
	readonly "hideTimeout"?: number | undefined;
	readonly "expandCloseIcon"?: (AsamMenuSubMenuProps)["expandCloseIcon"];
	readonly "expandOpenIcon"?: (AsamMenuSubMenuProps)["expandOpenIcon"];
	readonly "collapseCloseIcon"?: (AsamMenuSubMenuProps)["collapseCloseIcon"];
	readonly "collapseOpenIcon"?: (AsamMenuSubMenuProps)["collapseOpenIcon"];
};

参数与事件说明

`index`

必填：是；声明来源：上游声明。

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperClass`

必填：否；声明来源：上游声明。

popperClass 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`popperStyle`

必填：否；声明来源：上游声明。

popperStyle 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`teleported`

必填：否；声明来源：上游声明。

teleported 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

默认值与来源

未知 / 未声明

固定上游源码默认表达式：undefined（2.14.7；源码事实，未作为 ASAM 运行实测）

`disabled`

必填：否；声明来源：上游声明。

disabled 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举：false / true

`popperOffset`

必填：否；声明来源：上游声明。

`showTimeout`

必填：否；声明来源：上游声明。

`hideTimeout`

必填：否；声明来源：上游声明。

`expandCloseIcon`

必填：否；声明来源：上游声明。

expandCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuPropsPublic)["expandCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

expandCloseIcon.__isFragment: undefined — 依赖声明
expandCloseIcon.__isTeleport: undefined — 依赖声明
expandCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`expandOpenIcon`

必填：否；声明来源：上游声明。

expandOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuPropsPublic)["expandOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

expandOpenIcon.__isFragment: undefined — 依赖声明
expandOpenIcon.__isTeleport: undefined — 依赖声明
expandOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseCloseIcon`

必填：否；声明来源：上游声明。

collapseCloseIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuPropsPublic)["collapseCloseIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseCloseIcon.__isFragment: undefined — 依赖声明
collapseCloseIcon.__isTeleport: undefined — 依赖声明
collapseCloseIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

`collapseOpenIcon`

必填：否；声明来源：上游声明。

collapseOpenIcon 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(props: any, ctx: Parameters<Extract<NonNullable<(AsamMenuSubMenuPropsPublic)["collapseOpenIcon"]>, (...args: never[]) => unknown>>[1]): any

collapseOpenIcon.__isFragment: undefined — 依赖声明
collapseOpenIcon.__isTeleport: undefined — 依赖声明
collapseOpenIcon.__isSuspense: undefined — 依赖声明

默认值与来源

未知 / 未声明

固定上游源码未声明 default（2.14.7；源码事实，未作为 ASAM 运行实测）

AsamMenuSubMenuPropsPublic 公开类型视图

import type { AsamMenuSubMenuPropsPublic, AsamMenuExpose, AsamMenuProps, AsamMenuSubMenuProps } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamMenuSubMenuPropsPublic
type PublicContract = {
	readonly "index": string;
	readonly "popperClass"?: AsamMenuProps["popperClass"];
	readonly "popperStyle"?: (AsamMenuSubMenuPropsPublic)["popperStyle"];
	readonly "teleported"?: (AsamMenuSubMenuPropsPublic)["teleported"];
	readonly "disabled"?: boolean | undefined;
	readonly "popperOffset"?: number | undefined;
	readonly "showTimeout"?: number | undefined;
	readonly "hideTimeout"?: number | undefined;
	readonly "expandCloseIcon"?: (AsamMenuSubMenuPropsPublic)["expandCloseIcon"];
	readonly "expandOpenIcon"?: (AsamMenuSubMenuPropsPublic)["expandOpenIcon"];
	readonly "collapseCloseIcon"?: (AsamMenuSubMenuPropsPublic)["collapseCloseIcon"];
	readonly "collapseOpenIcon"?: (AsamMenuSubMenuPropsPublic)["collapseOpenIcon"];
};

参数与事件说明

`addSubMenu`

必填：是；声明来源：上游声明。

addSubMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`removeSubMenu`

必填：是；声明来源：上游声明。

removeSubMenu 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(item: AsamMenuItemRegistered): void

`handleMouseleave`

必填：否；声明来源：上游声明。

handleMouseleave 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数：(deepDispatch: boolean): void

`mouseInChild`

必填：是；声明来源：上游声明。

mouseInChild 参数与事件数据

下列为声明可读视图；可导入类型以公开类型视图为准。分支条件与父属性一致。

嵌套展开边界：框架 / 平台类型；完整类型见公开类型视图。

`level`

必填：是；声明来源：上游声明。

AsamMenuSubMenuProvider 公开类型视图

import type { Ref } from 'vue';
import type { AsamMenuSubMenuProvider, AsamMenuItemRegistered, AsamMenuExpose } from '@asam-ui/ui';

// AsamMenuSubMenuProvider
type PublicContract = {
	"addSubMenu": (item: AsamMenuItemRegistered) => void;
	"removeSubMenu": (item: AsamMenuItemRegistered) => void;
	"handleMouseleave"?: ((deepDispatch: boolean) => void) | undefined;
	"mouseInChild": Ref<boolean, boolean>;
	"level": number;
};

使用场景 ​

基础用法与状态 ​

基础用法与状态

使用约定 ​

水平菜单高度 ​

完整使用场景 ​

顶栏 ​

基础用法

左右 ​

左右

侧栏 ​

垂直布局

Collapse 折叠面板 ​

Collapse 折叠面板

弹出层偏移量 2.4.4 ​

弹出层偏移量 2.4.4

重算布局与更新选中项 ​

重算布局与更新选中项

API

属性 AsamMenuProps

实例方法与状态 AsamMenuExpose

类型 AsamMenuInstance

插槽 AsamMenuSlots

事件 AsamMenuEmits

类型 AsamMenuItemClicked

类型 AsamMenuItemEmits

类型 AsamMenuItemGroupPropsPublic

类型 AsamMenuItemPropsPublic

类型 AsamMenuItemRegistered

类型 AsamMenuPropsPublic

类型 AsamMenuProvider

类型 AsamMenuSubMenuInstance

类型 AsamMenuSubMenuProps

类型 AsamMenuSubMenuPropsPublic

类型 AsamMenuSubMenuProvider

用法与契约补充说明 ​

使用约定 ​

顶栏 ​

关联组件

参数与事件说明

collapse

默认值与来源

ellipsis

默认值与来源

mode

默认值与来源

popperClass

默认值与来源

popperStyle

默认值与来源

persistent

默认值与来源

showTimeout

默认值与来源

hideTimeout

默认值与来源

defaultActive

默认值与来源

defaultOpeneds

默认值与来源

menuTrigger

默认值与来源

collapseTransition

默认值与来源

popperOffset

默认值与来源

ellipsisIcon

默认值与来源

popperEffect

默认值与来源

uniqueOpened

默认值与来源

router

默认值与来源

closeOnClickOutside

默认值与来源

style

onSelect

key

使用场景

基础用法与状态

使用约定

水平菜单高度

完整使用场景

顶栏

左右

侧栏

Collapse 折叠面板

弹出层偏移量 2.4.4

重算布局与更新选中项

属性 `AsamMenuProps`

实例方法与状态 `AsamMenuExpose`

类型 `AsamMenuInstance`

插槽 `AsamMenuSlots`

事件 `AsamMenuEmits`

类型 `AsamMenuItemClicked`

类型 `AsamMenuItemEmits`

类型 `AsamMenuItemGroupPropsPublic`

类型 `AsamMenuItemPropsPublic`

类型 `AsamMenuItemRegistered`

类型 `AsamMenuPropsPublic`

类型 `AsamMenuProvider`

类型 `AsamMenuSubMenuInstance`

类型 `AsamMenuSubMenuProps`

类型 `AsamMenuSubMenuPropsPublic`

类型 `AsamMenuSubMenuProvider`

用法与契约补充说明

使用约定

顶栏

`collapse`

`ellipsis`

`mode`

`popperClass`

`popperStyle`

`persistent`

`showTimeout`

`hideTimeout`

`defaultActive`

`defaultOpeneds`

`menuTrigger`

`collapseTransition`

`popperOffset`

`ellipsisIcon`

`popperEffect`

`uniqueOpened`

`router`

`closeOnClickOutside`

`style`

`onSelect`

`key`

`ref`

`ref_for`

`ref_key`

`onVnodeBeforeMount`

`onVnodeMounted`

`onVnodeBeforeUpdate`

`onVnodeUpdated`

`onVnodeBeforeUnmount`

`onVnodeUnmounted`

`class`

`onClose`

`backgroundColor`

`textColor`

`activeTextColor`

`onOpen`

`$`

`$data`

`$props`

`$attrs`

`$refs`

`$slots`

`$root`

`$parent`

`$host`

`$emit`

`$el`

`$options`

`$forceUpdate`

`$nextTick`