Icon 图标

使用指南

在 app.json 或 index.json 中引入组件

  1. "usingComponents": {
  2.   "van-icon": "path/to/vant-weapp/dist/icon/index"
  3. }

代码演示

基础用法

Icon的name属性支持传入图标名称或图片链接

  1. <van-icon name="close" />
  2. <van-icon name="https://b.yzcdn.cn/vant/icon-demo-1126.png" />

显示徽标

  1. <van-icon name="chat" info="9" />
  2. <van-icon name="chat" info="99+" />

API

参数说明类型默认值
name图标名称或图片链接String-
info图标右上角文字提示String | Number-
color图标颜色Stringinherit
size图标大小，如 20px，2emStringinherit
custom-style自定义样式String-
class-prefix类名前缀Stringvan-icon

Event

事件名说明参数
bind:click点击图标时触发-

外部样式类

类名说明
custom-class根节点样式类

更新日志

版本类型内容
0.0.1feature新增组件
0.2.1feature新增 class-prefix 属性
0.3.6feature新增 custom-style 属性

原文: https://youzan.github.io/vant-weapp/#/icon