图标 Icon

基本用法

<template lang="html">
      <div>
     <div class="demo-hidden">
        <za-panel>
          <za-panel-header title="基本"></za-panel-header>
          <za-panel-body>
            <div class="grid">
              <div v-for='(i, index) in ICONS' class="grid-column" style="width: 33.33%;display: inline-block;padding: 15px;" :key="index">
                <za-icon theme="primary" :type='i' class='icon' style="fontSize:30px"/>
                <span class="icon-name">{{i}}</span>
              </div>
            </div>
          </za-panel-body>
        </za-panel>
      </div>
      </div>
</template>
<script>
const ICONS = [
  'right', 'right-round', 'right-round-fill',
  'wrong', 'wrong-round', 'wrong-round-fill',
  'info-round', 'info-round-fill',
  'question-round', 'question-round-fill',
  'warning-round', 'warning-round-fill',
  'arrow-left', 'arrow-right', 'arrow-top', 'arrow-bottom',
  'add', 'add-round', 'add-round-fill',
  'minus', 'minus-round', 'minus-round-fill',
  'broadcast',
].sort();
export default {
  data() {
    return {
      ICONS
    }
  }
};
</script>

API

Icon Attributes