(简易)测试数据构造平台: 11 (菜单组件化)

2022-07-07 15:00:08 浏览数 (2)

【本节目标】菜单部分变成组件,以调用方式安插进首页

首先,我们要新建一个普通小组件,按照我们之前所学,应该放在cpmponents文件夹下,新建好后如图所示:

然后,我们把菜单代码 剪切进来,注意是剪切,剪切后的首页也就没有菜单部分了:

ToolList.vue:

此时我们也看不到这个菜单了:

粘贴后的 Menu.vue:

那么接下来,我们只需要在首页中引入调用这个Menu.vue组件 ,即可。

打开首页 ToolList.vue

首先是引入bom层:

引入之后,在bom层找到之前的aside位置写上这个组件标签:

保存,看看浏览器,是不是又可以重新看到菜单了?

好了,这就是把菜单组件化,之后在其他页面,同样以这个办法,先在Bom层导入,然后dom层写上组件名作为标签对。即可展示这个菜单喽~

欢迎大家继续追更

0 人点赞