关于uni-app:uniapp使用icon

1. 开发环境 uni-app
2. 电脑系统 windows10 专业版
3. 在应用 uni-app 开发的过程中, 咱们总是会应用到 icon, 上面我来分享一下在 uni-app 开发应用 icon, 心愿对你有所帮忙!
4. 在这里我抉择的字体库是阿里巴巴矢量库, 登录, 把图标下载下来

5. 下载完了之后关上文件，除了iconfont.css 其余文件一律删除

6. 回到本人的 iconfont 我的项目，抉择unicode 点击生成代码

7. 生成结束之后点击复制代码

8. 回到iconfont.css 并且关上 css 文件，留神红框内容，全副删除，替换成第五步刚刚复制过去的

9. 替换结束之后， 须要在 //at 后面加上 https:

10. 在页面中应用 iconfont, 代码如下:

<template>
    <view class="content">
        <text class="iconfont iconche-copy"></text>
    </view>
</template>

<script>
    export default {data() {
            return {title: 'Hello'}
        },
        onLoad() {},
        methods: {}}
</script>

<style>

/抉择 iconfont.css 所在的门路/

    @import '../../static/icon/iconfont.css';
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .logo {
        height: 200rpx;
        width: 200rpx;
        margin-top: 200rpx;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 50rpx;
    }

    .text-area {
        display: flex;
        justify-content: center;
    }

    .title {
        font-size: 36rpx;
        color: #8f8f94;
    }
</style>

11. 效果图如下:

12. 本期的分享到了这里就完结啦, 是不是很 nice, 心愿对你有所帮忙, 让咱们一起致力走向巅峰!