vue-iconfont字体图标

<template>
  <div>
    <i style="font-family: '天气';" v-for="(li,i) in icons" :key="i" v-html="`&#x${li.unicode};`"></i>
  </div>
</template>

<script>
  export default {
    name: "a15",
    data() {
      return {
        icons: []
      }
    },
    mounted() {
      // 获取字体json配置
      this.$axios({
        url: 'https://at.alicdn.com/t/font_2654525_ij8acsuxo8d.json?spm=a313x.7781069.1998910419.84&file=font_2654525_ij8acsuxo8d.json',
        method: 'get'
      }).then(res => {
        this.icons = res.data.glyphs
      })
    }
  }
</script>

<style scoped>
  @font-face {
    font-family: '天气';  /* Project id 2654525 */
    src: url('//at.alicdn.com/t/font_2654525_ij8acsuxo8d.woff2?t=1625555631443') format('woff2'),
    url('//at.alicdn.com/t/font_2654525_ij8acsuxo8d.woff?t=1625555631443') format('woff'),
    url('//at.alicdn.com/t/font_2654525_ij8acsuxo8d.ttf?t=1625555631443') format('truetype');
  }
</style>