wxc-icon

Weex 常用 iconfont 的封装

Demo

wxc-icon 常用 iconFont - 图1 wxc-icon 常用 iconFont - 图2

weex-ui >= 0.3.10

使用方法

  1. <template>
  2. <wxc-icon name="success"></wxc-icon>
  3. </template>
  4. <script>
  5. import { WxcIcon } from 'weex-ui'
  6. export default {
  7. components: { WxcIcon }
  8. }
  9. </script>

更详细代码可以参考 这里

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

可配置参数

Prop Type Required Default Description
name string Y - icon 的名称 (注1)
size String N small icon的尺寸 xs/small/medium/large
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'}Click to copy

事件回调

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

Please feel free to use and contribute to the development.

原文: https://alibaba.github.io/weex-ui/#/cn/packages/wxc-icon/