<template>
  <i class="iconfont qf-icon" :class="name" :style="iconStyle" @click="onClick($event)"/>
</template>

<script>
  export default {
    name: 'QfFontIcon',
    props: {
      name: String,
      size: {
        type: String
      },
      color: {
        type: String
      }
    },
    computed: {
      iconStyle () {
        return {
          fontSize: this.size,
          color: this.color
        };
      }
    },
    methods: {
      onClick (event) {
        this.$emit('click', event);
      }
    }
  };
</script>
