当前位置: 首页 > 文档资料 > Weex UI 中文文档 >

wxc-icon

优质
小牛编辑
140浏览
2023-12-01

Weex 常用 iconfont 的封装

Demo

weex-ui >= 0.3.10

使用方法

<template>
   <wxc-icon name="success"></wxc-icon>
</template>

<script>
  import { WxcIcon } from 'weex-ui'
  export default {
    components: { WxcIcon }
  }
</script>

更详细代码可以参考 这里

同时你可以从 demo 进行复制 name

可配置参数

Prop Type Required Default Description
name string Y - icon 的名称 (注1)
size String N small icon的尺寸 xs/small/medium/big
icon-style Object N {} 样式覆盖 (注2)
  • 注1:icon的名称详细如下:['less', 'more_unfold', 'back', 'more', 'add', 'subtract', 'close', 'cry', 'search', 'delete', 'help', 'refresh', 'success', 'warning', 'wrong', 'clock', 'scanning', 'filter', 'map', 'play']

  • 注2:当 size 不能满足时候,或者需要自定义样式类型可以传入style覆盖,例如:

       style={color:red,fontSize:'60px'}

事件回调

// `@wxcIconClicked="iconClicked"`
将会返回 name