vue 嵌套表格组件_[前端随笔][Vue] 多级菜单实现思路——组件嵌套

说在前面

本篇记录学习了vue-element-admin中的多级菜单的实现 　　[

@vue/cli 4.2.2；vuex；scss；组件嵌套

正文

创建项目

npm create 项目名 //或npm init webpack 项目名

安装element-ui

npm add element-ui //或npm i element-ui

安装vuex

npm add vuex //或npm i vuex

安装完vuex后会出现src/store目录，同时在src/main.js中vue实例添加了store(这里是关于vuex的知识先放一下)

首先侧边栏的内容哪来？需要根据路由表来展示。

所以我们需要

一、 构造子页面并配置路由

1 在src/views目录建两个目录和三个vue文件book/read.vue，book/write.vue和 movie/watch.vue (template+script构造页面)

2 接着配置这三个页面的路由如下

constroutes = [

{

path: '/book',

component: Layout,

redirect: '/book/write',

children: [

{

path: '/book/write',

component: () => import('@/views/book/write'),

name: 'book',

meta: