退出登录与jsx显示

一：退出登录前台内容，我们需要mutations的辅助函数mapmutations，在组件中...映射mutation里面的方法，然后再通过this.方法（值）给这个传值定义。在这之前也要把memoryUtils里面的user清空，和storageUtils里面的也清空，然后在用this.GETUSER({}),再进行重定向就好了。

二：左侧导航栏的动态显示-菜单项目需要进行动态的展示，不能写死，然后就用了jsx语法

1：在src目录下创建config文件夹，然后创建menuconfig文件，里面写菜单列表。然后也要安装jsx插件npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props，在再bable里面配置一下让jsx的文件转换成浏览器能识别的语法

2：配置好了，显示有两种选择，一个是在template模板里面写，另一个就是在render函数里面写，用renturn（里面在element-ui里面菜单组件）就能把div显示出来

3；既然这样那我就利用jsx把左侧内容显示出来，先左侧组件vue中加一个render（）{}这里面写菜单导航的样式还有，把在menthods里面定义的方法展示菜单利用map去便利我新建的菜单李彪文件里面的内容，然后符合就展示，最后储存到一个变量中（在data中定义的储存菜单的一个量），然后让在render用{this.变量名}来写这个变量，这样就利用jsx把菜单展示出来了。

 

 

左侧菜单导航写好了，那么就进行，配置各部分的组件和路由

二：配置路由组件

在views文件下创建各部分组件，然后在router文件夹里面index.js配置路由

 写完这个我就要去写路由出口了，因为我要在main里面展示所以，在main里面写出口router-view

三：有一个问题就是我访问根目录，不展示首页的内容，是空白

在路由中访问根目录有配置中重定向一下，就好了