博客
关于我
vue3+Element-plus icon图标无法显示的问题(已解决)
阅读量:796 次
发布时间:2023-02-16

本文共 572 字,大约阅读时间需要 1 分钟。

在使用Vue 3和Element Plus 1.2.0-beta.3版本时,导航侧栏的图标无法显示的问题

  • 问题背景

    • 在引入侧栏组件时,左侧的图标无法显示。
    • 图标位置为空,显示异常。
  • 问题分析

    • Element Plus 1.2.0-beta.3版本对图标引入方式进行了更新,图标命名和路径发生了变化。
    • 默认的图标引入方式不再有效,需要手动引入并使用正确的标签。
  • 解决方案

    • 方案一:手动引入并注册图标组件。
      import {Location, Setting, Menu, Document} from '@element-plus/icons'
      export default {
      components: {
      Location, Setting, Menu, Document
      }
      }
      • 使用引入的图标时,仍需正确设置标签名。
    • 方案二:手动添加SVG图标。
      Navigator Two
      • 确保使用正确的SVG路径和配置。
  • 优化总结

    • Element Plus新版本图标引入方式改变,需手动配置。
    • 使用SVG标签或正确的图标组件来显示图标。
    • 确保图标路径和标签名与新版本一致。
  • 转载地址:http://yxjfk.baihongyu.com/

    你可能感兴趣的文章
    Mysql8在Centos上安装后忘记root密码如何重新设置
    查看>>
    Mysql8在Windows上离线安装时忘记root密码
    查看>>
    MySQL8找不到my.ini配置文件以及报sql_mode=only_full_group_by解决方案
    查看>>
    mysql8的安装与卸载
    查看>>
    MySQL8,体验不一样的安装方式!
    查看>>
    MySQL: Host '127.0.0.1' is not allowed to connect to this MySQL server
    查看>>
    Mysql: 对换(替换)两条记录的同一个字段值
    查看>>
    mysql:Can‘t connect to local MySQL server through socket ‘/var/run/mysqld/mysqld.sock‘解决方法
    查看>>
    MYSQL:基础——3N范式的表结构设计
    查看>>
    MYSQL:基础——触发器
    查看>>
    Mysql:连接报错“closing inbound before receiving peer‘s close_notify”
    查看>>
    mysqlbinlog报错unknown variable ‘default-character-set=utf8mb4‘
    查看>>
    mysqldump 参数--lock-tables浅析
    查看>>
    mysqldump 导出中文乱码
    查看>>
    mysqldump 导出数据库中每张表的前n条
    查看>>
    mysqldump: Got error: 1044: Access denied for user ‘xx’@’xx’ to database ‘xx’ when using LOCK TABLES
    查看>>
    Mysqldump参数大全(参数来源于mysql5.5.19源码)
    查看>>
    mysqldump备份时忽略某些表
    查看>>
    mysqldump实现数据备份及灾难恢复
    查看>>
    mysqldump数据库备份无法进行操作只能查询 --single-transaction
    查看>>