关于elementplus的button按钮里面的icon图标不显示的问题

1.安装：npm install @element-plus/icons-vue2.引入：import { Delete, Edit, Search, Share, Upload} from '@element-plus/icons-vue'3.注册：components: {Search,Edit,Delete},4.使用：<div class="btnBox"><el-

口袋の的天空

3111人浏览 · 2022-04-04 10:21:14

口袋の的天空 · 2022-04-04 10:21:14 发布

1.安装：

npm install @element-plus/icons-vue

2.引入：

import { Delete, Edit, Search, Share, Upload  } from '@element-plus/icons-vue'

3.注册：

components: {
    Search,
    Edit,
    Delete
  },

在这里插入图片描述

4.使用：

            <div class="btnBox">
              <el-button type="primary" plain @click="onSearch">
                <el-icon>
                  <Search />
                </el-icon>
                新增
              </el-button>
              <el-button type="success" plain @click="onSearch">
                <el-icon>
                  <Edit />
                </el-icon>
                修改
                </el-button>
              <el-button type="danger" plain @click="onSearch">
                <el-icon>
                  <Delete />
                </el-icon>
                删除
              </el-button>
              <el-button type="info" plain @click="onSearch">导入</el-button>
              <el-button type="warning" plain @click="onSearch">导出</el-button>
            </div>

5.效果：

在这里插入图片描述

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^