微信小程序 icon
使用示例参见 https://gitlab.iqianggou.com/xmini/iconfont
使用icon
推荐方案:引入 iconfont 的css类即可,icon 可由字体 font-size
控制大小,使用如下:
// 代码中可以直接使用 class 来引用 icon,如
<text class="iconfont icon-close"></text>
<view class="iconfont icon-feedback"></view>
也可以引用 dwd-icon
组件来使用 icon
-
dwd-icon
支持图片以及 iconfont - 设置图片 需要提供图片路径,作为背景100%渲染(此时不支持 color)
- 设置 iconfont,需要设定字体图标后使用
TODO: 严重问题,全局引入的样式(如iconfont)在组件内不能直接生效,需要重新引入一遍,这会导致这个组件无法使用
- json中引用
"dwd-icon": "@xmini/wxapp-component-icon"
- wxml中使用:
<dwd-icon
name="close"
size="32"
color="red"
/>
<dwd-icon name="xiangji"></dwd-icon>
<dwd-icon name="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=484763539,264346239&fm=27&gp=0.jpg" size="40"></dwd-icon>
<dwd-icon mode="custom" name="arrow-right" size="40"></dwd-icon>