tree-menu组件里的icon不显示

Question

代码如下

<template>
  <template v-for="menu in userMenu">
    <el-submenu
        index="menu.path" v-if="menu.children && menu.children.length > 0" :key="menu.id">
      <template #title>
<!--        <i class="el-icon-location"></i>-->
        <i :class="menu.icon"></i>
        <span>{{menu.menuName}}</span>
<!--        <i class="el-icon-location"></i>-->
      </template>
      <tree-menu :userMenu="menu.children" />
    </el-submenu>
    <el-menu-item v-else :index="menu.path" :key="menu.id">{{menu.menuName}}</el-menu-item>
  </template>
</template>
<script>
export default {
  name: "TreeMenu",
  props:{
    userMenu: {
      type: Array,
      default(){
        return []
      }
    }
  }
}
</script>

<style lang="scss">

</style>

将class换成固定的 el-icon-location 图标也是不显示的，不知道哪里原因 之前放在home这个组件里是可以显示的

Answer 1

qq_慕先生1026127 2021-09-23 12:40:27

请问怎么解决的？

• 河畔一角 #1

  main.js 导入一下这个样式试一下：
  import "element-plus/packages/theme-chalk/src/base.scss"
  
  //img1.sycdn.imooc.com//szimg/60dade700970670b06470114.jpg

• qq_慕先生1026127 回复 河畔一角 #2

  解决了 不是这个问题，我是名字显示不出来，因为我敲错了...menu  meun

• 河畔一角 回复 qq_慕先生1026127 #3

  好的，你单词拼错了。

点开查看后面2条评论

Answer 2

河畔一角 2021-06-05 13:14:40

按照官方文档，你的代码是没有问题的，可以在群里@一下我，把代码发给我，我本地运行一下。