wxc-tag

Weex 通用标签组件，支持实心标签、空心标签、特殊标签、图片标签

Demo

wxc-tag 标签 - 图1 wxc-tag 标签 - 图2

使用方法

  1. <template>
  2.   <div class="wrapper">
  3.    <wxc-tag type="solid"
  4.             tag-color="#ff5000"
  5.             font-color="#ffffff"
  6.             value="实心标签"></wxc-tag>
  7.   </div>
  8. </template>
  9. <script>
  10.   import { WxcTag } from 'weex-ui';
  11.   export default {
  12.     components: { WxcTag }
  13.   };
  14. </script>

可配置参数

Prop Type Required Default Description
type String N solid 标签的类型(注1)
value String Y - 文字标签的文案
tag-color String N #ff5000 标签颜色
font-color String N #ffffff 文字颜色
special-icon String N - 特殊标签的小icon(注2)
img String N - 图片类型tag的图片地址(注3)
  • 注1: type的类型有如下四种solid、hollow、special、image，默认是solid(实心)
  • 注2: specialIcon本应该为iconfont的，但是考虑的Weex,直接使用png会更方便
  • 注3: type为image时，img字段为必传

Please feel free to use and contribute to the development.

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