之前多次尝试<router-view/>都跳转了页面，后来发现“:is”更简单
is简介：官网：/v2/api/#is
1.写一个切换组件的方法，传入组件名
2.引入要切换的组件，并包含进当前组件componens内
3. ：is引入组件
导航菜单直接在element-ui上拷的，用法可以参考官网/#/zh-CN/component/installation
完整代码：（就当看者有vue基础）
<template><el-container>//element-ui页面布局<el-header>//菜单导航<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" ><el-menu-item index="1">处理中心</el-menu-item><el-submenu index="2"><template slot="title">我的工作台</template><el-menu-item index="2-1" @click="tabChange('upload')" >普通提交</el-menu-item><el-menu-item index="2-2" @click="tabChange('Login')">登录</el-menu-item><el-menu-item index="2-3">选项3</el-menu-item><el-submenu index="2-4"><template slot="title">选项4</template><el-menu-item index="2-4-1">选项1</el-menu-item><el-menu-item index="2-4-2">选项2</el-menu-item><el-menu-item index="2-4-3">选项3</el-menu-item></el-submenu></el-submenu><el-menu-item index="3" disabled>消息中心</el-menu-item><el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item></el-menu></el-header><el-main><div :is="currentView"></div></el-main></el-container></template><script>//引入需要切换的组件import Upload from '@/components/views/Upload.vue'import Login from '@/components/login.vue'export default {name:'Header',components:{Upload,Login},data(){return{activeIndex: '1',currentView:''}},methods:{tabChange(tabItem) {this.currentView = tabItem;}}}</script>
效果：上面是菜单，下面是组件内容。
有一个问题就是子组件完成工作后要跳转其他页面，还要让他显示在这里，也当一个子组件，就要调用包含菜单栏的父组件的切换组件方法，有些麻烦。所以最好就是把菜单组件抽取处理，直接在app.vue里面引用，让其他页面都直接引用菜单栏，就不会有太多父子关系。
我是后端，前端只是不够扎实，有问题可以直接指出。
