<!--
 * @Author: yuanyuan60@staff.weibo.com
 * @Date: 2020-10-16 10:40:23
 * @LastEditTime: 2020-10-21 20:27:08
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /wblive-ui/packages/apng/apng.vue
-->

<template>
  <img :src="src" :class="classNames" :style="{width:width,height:height}">
</template>

<script>
  import APNG from './main'
  import mixin from '../mixin'
  const prefixCls = 'wl_apng'; //icon类名前置

  export default {
    name: mixin.prefix+'apng',
    props: {
      src: String,
      width: String,
      height: String,
    },
    data() {
      return {
        classNames: {
          [prefixCls]: true
        }
      }
    },
    mounted() {
      APNG.ifNeeded()
        .then(function() {
          var images = document.querySelectorAll(".wl_apng");
          for (var i = 0; i < images.length; i++) {
            APNG.animateImage(images[i]);
          }
        })
    }
  }
</script>

