不用学习直接编写uni-app(页面中引用 引用(本地)阿里图标库的问题)

1、把阿里图标通过项目打包方式下载到本地，拷贝到uni-app项目的如下目录。

      ​​

2、在需要引用的XXX.vue页面文件中添加如下代码。

在<style>标签中添加

/* icon图标 */

@font-face {

font-family: iconfont;

font-weight: normal;

font-style: normal;

src: url('../../static/font/iconfont.ttf')

format('truetype');

}

.menumark{

font-family: iconfont;

……

}

在<template>中引用

<text class="menumark">&#xe603;</text>

引用效果

​​

3、注意不能通过初始化的方式去赋值

如在初始化时将在放在data中

data() {

    return {

        menus: [{

        id: 'shipin',

       text: '视频对讲',

        mark: '&#xe603;

    }]

    }

}

在页面通过

<view class="menulist" v-for="(value,key) in menus" :key="key">

    <view class="menuItem">

        <text class="menumark">{{ value. mark }}</text>

    </view>

</view>

不然不会显示图标，只会显示&#xe603;