十一、规划主菜单

当随着功能越来越丰富,需要我们规划好主菜单,单击某个菜单项,加载某个功能。

1、引入element-plus
        Element Plus,由饿了么大前端团队开源出品的一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的组件库.

npm install [email protected]

修改main.ts:

	import { createApp } from 'vue'
	import './style.css'
	import App from './App.vue'
	import ElementPlus from 'element-plus'
	import 'element-plus/dist/index.css'
	const app = createApp(App)
	app.use(ElementPlus)
	app.mount('#app')

如果显示不满屏,改index.html,加上:
  <body  style="margin: 0 !important">

2、封装菜单组件
    src/components/MainMenu.vue,有兴趣的同学可以留言索要完整代码:

<template>
  <div v-if="showAside" v-show="!isShow" id="menu" :title="showMenu?'关闭菜单':
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

vandh

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值