码迷,mamicode.com
首页 > 其他好文 > 详细

weex用阿里矢量图

时间:2018-04-17 20:55:13      阅读:435      评论:0      收藏:0      [点我收藏+]

标签:出现   UI   网易   pre   执行   文件   javascrip   矢量   注意   

首先这段代码来自 zwwill在github上的 weex网易严选项目

他是在utils下封装了一个方法

let utilFunc = {
    initIconFont () {
        let domModule = weex.requireModule(‘dom‘);
        domModule.addRule(‘fontFace‘, {
            ‘fontFamily‘: "iconfont",
            ‘src‘: "url(‘http://at.alicdn.com/t/font_630973_b31no0qq0nt57b9.ttf‘)"
        });
    }
}

 通过  dom模块的 addRule方法

能够在html的中添加代码

字体图标有很多文件,ttf,eof,svg,woff

但是只加载这个 ttf 就能出现效果了

执行 initIconFont 之后 就在html中添加了一下代码

@font-face {
  font-family: ‘iconfont‘;  /* project id 630973 */
  url(‘//at.alicdn.com/t/font_630973_b31no0qq0nt57b9.ttf‘) format(‘truetype‘)
}

 然后字体图标就生效了

注意:字体图标的链接记得改成自己的。

weex用阿里矢量图

标签:出现   UI   网易   pre   执行   文件   javascrip   矢量   注意   

原文地址:https://www.cnblogs.com/anxiaoyu/p/8869707.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!