Element-plus菜单动态渲染时，菜单图标不显示的问题

问题：使用的菜单数据是后天返回的，当在组件中遍历菜单数据动态生成菜单的时候，菜单可以显示，但是菜单图标不显示，使用的是component进行动态渲染图标的

<template #title>
  <component :class="item.icon" :is="item.icon"></component>
  <span>{{ item.displayName }}</span>
</template>

如以上代码所示，icon不会显示

解决方案： 原因：后台返回的只是一个图标的名称，component的is属性接收的是一个图标组件，如果将组件本身传递给is，则不需要注册的，但是这里只是将组件名称传递给is属性，所以图标不会显示

方法：在main.js中将图标注册成全局组件，图标就会展示了

import { createApp } from 'vue'
import App from './App.vue'
import * as Icons from '@element-plus/icons-vue'

const app = createApp(App)
app.mount('#app')

// 注册element-icon全局组件
Object.keys(Icons).forEach((key) => {
  app.component(key, Icons[key])
})