<el-menu :default-active="activeIndex" mode="horizontal" @select="handleSelect" style="padding-left: 5px;font-weight: bold;"> <el-submenu> <template slot="title">分类</template> <div v-for="(types, index) in Types" :key="index"> <el-menu-item>{{ types.tname }}</el-menu-item> </div> </el-submenu> </el-menu>

这是一个使用 Element UI 组件库的 Vue.js 代码片段。这段代码定义了一个水平导航菜单（`el-menu`），默认选中项的索引由 `activeIndex` 变量控制，菜单的模式为水平模式（`mode="horizontal"`），当用户选择菜单项时，会触发 `handleSelect` 方法。在菜单中定义了一个子菜单（`el-submenu`），并使用 `v-for` 指令遍历 `Types` 数组中的元素，在子菜单中为每个元素添加一个菜单项（`el-menu-item`），菜单项的内容为 `types.tname`，其中 `types` 是遍历到的当前元素，`tname` 是该元素的属性。最终的效果是在菜单中显示了一个名为“分类”的子菜单，子菜单中包含了多个菜单项，每个菜单项的内容为 `Types` 数组中的元素的 `tname` 属性。