weex加入iconfont
weex加入图标可能是项目开发中最头疼的事情了,还好有 阿里巴巴矢量图标库解决了开发时的图标问题,下面我们一起来踩坑吧 <text class="left"></text>
<style>
.left{
font-family:iconfont
}
</style> data(){...},
methods:{...},
created (){
var domModule=weex.requireModule("dom");
domModule.addRule('fontFace',{
'fontFamily':'iconfont', //注意这里必须是驼峰命名,跟上面的css样式对照
'src':"url(\'http://at.alicdn.com/t/font_492735_cqteemnpxk7ta9k9.ttf\')"
})
}
打开 http://www.iconfont.cn/
搜索你想要的图标 => 加入购物车 => 把图标整理好之后 => 点右上角的购物车图标 => 添加到项目
选择第一个,生成代码,复制下方代码到项目里

weex加入iconfont的更多相关文章
- weex 学习: 添加图标(使用阿里吧吧-icon)
添加图标(使用阿里吧吧-icon) <text slot="left" class="header-left"></text> i ...
- weex用阿里矢量图
首先这段代码来自 zwwill在github上的 weex网易严选项目 他是在utils下封装了一个方法 let utilFunc = { initIconFont () { let domModul ...
- Weex学习与实践
Weex学习与实践(一):Weex,你需要知道的事 本文主要介绍包括Weex基本介绍.Weex源码结构.初始化工程.we代码结构.Weex的生命周期.Weex的工作原理.页面间通信.boxmodel ...
- weex 项目开发(五)自定义 过滤函数 和 混合 及 自定义 Header 组件
1.自定义 过滤函数 src / filters / index.js /** * 自定义 过滤函数 */ export function host (url) { if (!url) return ...
- weex 项目开发(四)项目框架搭建 及 自定义 TabBar 组件
1.安装 路由模块 及 状态管理模块 npm install vue-router --save npm install vuex --save 2.自定义 TabBar 组件 src / ...
- weex 项目 创建 远程 icon
一.创建 远程 icon 步骤一:打开 阿里巴巴矢量图标库 官网:http://www.iconfont.cn/ 步骤二:选择项目需要的 icon 步骤三:添加到项目(没有项目会自动创建) 步骤四: ...
- weex手机端安全键盘
github地址:weexSafeKeyboard 效果图: 技术依赖:框架:weex+vue 弹出层:weex-ui 图标:iconfont 说明:1.如果不想用到weex-ui,可以把inputk ...
- 【weex】h5weex-example
这个就是一个练手的基础性的demo,不过也是有很多值得学习的东西的 效果如下 项目地址为:https://github.com/h5weex/h5weex-example 可能是我找到的项目比较少,很 ...
- Nvue/Weex
Nvue/Weex 使用Uniapp做了一个App,感觉性能不是很好,了解过Uniapp的Nvue,就想做一个纯Nvue项目,其实基本就是做一个Weex项目,不得不说坑是真的多,但是渲染性能真的是没得 ...
随机推荐
- A Simple Math Problem(矩阵快速幂)(寒假闭关第一题,有点曲折啊)
A Simple Math Problem Time Limit: 3000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Other ...
- JDBC(MySQL)一周学习总结(一)
一周过去了,我在这分享一下这一周来学习 JDBC 的知识,同时也希望可以帮到别人! 首先我们从获取 JDBC 连接开始 Driver(每个驱动程序类必须实现的接口) 获取数据库连接需要配置数据库连接信 ...
- 前端的UI设计与交互之色彩篇
一.颜色Red热情.警示 Green成功.通过.安全 Blue专业.科技 Pink典雅.明快.女性 Orange醒目.温暖 Purple高雅.浪漫 Yellow活力.提示 Cyan清新.冷静.结构化 ...
- VMware驱动程序"vmci.sys"的版本不正确 怎么解决
解决办法: 1.创建好虚拟机之后,别打开电源,然后到建好的虚拟机文件夹里: 2.找到后缀vmx的文件,记事本打开: 3.找到vmci0.present='TRUE',把true改为false: 4.保 ...
- js中编码问题escape、encodeURI
未分类 1.js对文字进行编码涉及3个函数: escape,encodeURI,encodeURIComponent, 相应3个解码函数:unescape,decodeURI,decodeURIC ...
- cross-document message 跨文档通信 HTML5
跨域通信HTML5提供了XDM(cross-document message)安全简单接口: 核心是 postMessage()方法,用来向另一个地址传送信息: var iframeWindow ...
- Scrum Meeting Alpha - 4
Scrum Meeting - NewTeam // 地点:新主楼F座二楼 任务反馈 团队成员 完成任务 计划任务 安万贺 确定了API部分的目录结构及包装方式,完成了部分API的包装https:// ...
- 在为知笔记中使用Markdown和思维导图
为知笔记Wiz是一款很好的网摘和笔记工具,作为为知的忠实用户,我在为知收费后第一时间就购买了两年的授权,毕竟这么多年积累的资料都在为知上,我也习惯了使用Wiz来做些工作相关的笔记.为知笔记自带Mark ...
- Velocity(6)——velocity遍历josn格式的字符串
使用velocity脚本语言遍历josn格式的字符串 1.由于数据库会存储一些json格式的字符,为方便以后使用筛选 如果这些数据我们查出来直接遍历使用velocity是根本行不通的,例如这样的话:j ...
- Python之signal模块
http://www.cnblogs.com/dkblog/archive/2011/03/07/1980636.html 1.超时处理 #!/usr/bin/env python2.7 #-*- c ...