记录今日问题elementUI的二级菜单样式单独修改

最近在重写一个网站，网站本身是用原生js写的，但是自己想要提高一下使用vueCLI和elementUI的能力，就选择了这两种来写。

在写导航栏菜单的时候遇到问题，我想要单独更改二级菜单的样式，发现无论是使用/deep/、！important、：：v-deep，设置的样式都不管用。

 就去看官方文档，发现subMenu有一个popper-class自定义类名属性，就设置了一个自定义类名，通过自定义类名去设置二级菜单的样式。结果还是不生效。

最后查了很久资料。发现通过prop-class自定义类名修改的样式要放在App.vue的style里才能生效

1.  
   <el-submenu index="2" popper-class="navTwo">
2.  
   <template slot="title">最新动态</template>
3.  
   <el-menu-item index="2-1">工作动态</el-menu-item>
4.  
   <el-menu-item index="2-2">民调要闻</el-menu-item>
5.  
   <el-menu-item index="2-3">媒体报道</el-menu-item>
6.  
   <el-menu-item index="2-4">行业快递</el-menu-item>
7.  
   </el-submenu>

样式修改：

这篇好文章是转载于：学新通技术网