【本节目标】菜单部分变成组件,以调用方式安插进首页
首先,我们要新建一个普通小组件,按照我们之前所学,应该放在cpmponents文件夹下,新建好后如图所示:
然后,我们把菜单代码 剪切进来,注意是剪切,剪切后的首页也就没有菜单部分了:
ToolList.vue:
此时我们也看不到这个菜单了:
粘贴后的 Menu.vue:
那么接下来,我们只需要在首页中引入调用这个Menu.vue组件 ,即可。
打开首页 ToolList.vue
首先是引入bom层:
引入之后,在bom层找到之前的aside位置写上这个组件标签:
保存,看看浏览器,是不是又可以重新看到菜单了?
好了,这就是把菜单组件化,之后在其他页面,同样以这个办法,先在Bom层导入,然后dom层写上组件名作为标签对。即可展示这个菜单喽~
欢迎大家继续追更