VUE3 Element UI el-button type && icon

常见的图标值:

Element Plus 使用的是 Iconify 图标库,包含了很多内置的图标,可以通过 icon 属性来引用。常见的图标值有:

  • 删除相关

    • "delete":删除(垃圾桶)图标

    • "delete-solid":删除(实心垃圾桶)图标

    • "remove":移除图标

  • 编辑相关

    • "edit":编辑图标(铅笔)

    • "edit-outline":编辑(线框)图标

  • 查看相关

    • "eye":查看图标(眼睛)

    • "eye-open":查看(打开眼睛)

  • 操作相关

    • "check":确认图标(勾选)

    • "check-circle":圆圈勾选图标

    • "close":关闭图标(叉号)

  • 文件相关

    • "document":文档图标

    • "folder":文件夹图标

    • "folder-open":打开文件夹图标

  • 其他常见图标

    • "search":搜索图标(放大镜)

    • "home":首页图标

    • "setting":设置图标(齿轮)

    • "add":添加图标(加号)

    • "upload":上传图标(上箭头)

    • "download":下载图标(下箭头)

    • "loading":加载中的图标(旋转)

    • "share":分享图标(两个箭头交叉)

    • "warning":警告图标(感叹号)

总结所有 type 的按钮风格:

  • primary:主要操作

  • success:成功

  • warning:警告

  • danger:危险

  • info:信息

  • text:文本

  • default:默认