element-plus中el-button的icon图标不显示

element-plus官网

的新写法不能用,在icon的示例里面方法可以使用。

<el-button type="primary">
? ? <el-icon style="vertical-align: middle;">
? ? ? <search />
? ? </el-icon>
? ? <span style="vertical-align: middle;"> Search </span>
? </el-button>

有两种解决方案:
1.使用最新版本的element-plus,
写法:

?<el-button type="primary">
????<el-icon style="vertical-align: middle;">
??????<search />
????</el-icon>
????<span style="vertical-align: middle;"> Search </span>
??</el-button>

2.使用旧版本 element-plus@1.1.0-beta.24以及之前的版本(不能太旧,否则与vue3.0有冲突)
写法:

<el-button type="warning" icon="el-icon-edit" circle></el-button>

参考:https://github.com/element-plus/element-plus/issues/2898


版权声明:本文为m0_54853503原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。