vue使用字体图标转码问题
使用iconfont字体之后,出现的是一个方框,而没有出现相应的图标
需要通过String.fromCharCode方法转成指定unicode编码对应的十六进制字符
<div class="info-list">
<ul>
<li v-for="(val,key) in essay">
<i class="iconfont">{{String.fromCharCode(parseInt(val.font,16))}}</i>
<a href="javascript:void(0);">{{val.content}}</a>
<span>{{val.txt}}</span>
</li>
</ul>
</div>
data(){
return{
essay:[
{
font:'e7a5;',
content:'南京江宁楼盘中骏六号街区涉嫌',
txt:'2018-08-18'
},
{
font:'e7a5',
content:'北京江宁楼盘中骏六号街区涉嫌',
txt:'2018-09-18'
},
{
font:'e7a5',
content:'上海江宁楼盘中骏六号街区涉嫌',
txt:'2018-08-8'
},
{
font:'e7a5',
content:'广州江宁楼盘中骏六号街区涉嫌',
txt:'2018-08-28'
}
]
}
}
vue使用字体图标转码问题的更多相关文章
- VUE引入字体图标库
1. 下载阿里图标 2. 解压文件,并复制文件到VUE项目内 3. 找到添加的字体图标的.css文件,将.iconfont改成[class^="iconfont"], [class ...
- vue 外部字体图标使用,无须绝对路径引入办法
通常外部字体图标都在使用 iconfont ,这种图标在网上搜到一大把都是由于路径问题显示不出来,或者是显示个方块. 最近的项目中也碰到这个坑爸的问题,总结一下解决办法: 和 webpack.conf ...
- vue 中使用iconfont Unicode编码线上字体图标的流程
1.打开http://www.iconfont.cn官网,搜索你想要的图标.添加字体图标到购物车,点击购物车然后添加至项目,点击确定 2.点击图标管理/我的项目,找到对应的文件,点击Unicode,然 ...
- vue中引入第三方字体图标库iconfont,及iconfont引入彩色图标
iconfont字体图标使用就不多说了,大致是几部: 1.在iconfont官网选图标,加入购物车,加入项目,下载到本地,解压 2.在项目assets目录新建目录iconfont,用于存放刚才下载解压 ...
- vue中引入字体图标报错,找不到字体文件
在用vue + webpack进行开发的时候,在引用字体图标遇到字体无法加载的问题: 报以下错误 搞了好久没搞定,最后才找到解决方法(还是没有找到原因) 修改字体图标的css中引入字体文件的路径 以前 ...
- vue之placeholder中引用字体图标
先说一下问题:在placeholder中想使用字体图标,结果渲染不正确,代码如图 效果如图 在网上get到了解决方法: 在VUE组件中,给placeholder添加图标,需要注意以下几点: 1.不要给 ...
- vue中使用svg字体图标
1.在src/ 下面新建目录icons,里面新建文件夹svg,和文件index.js .svg用于存放从iconfont下载下来的svg格式的图标,index.js用于引入使用到svg文件和对应的组件 ...
- vue项目打包部署elementUI的字体图标丢失问题
自己搭建的Vue项目,没有使用vue-cli,引入elementUI时,使用的是webpack直接打包工具,发现字体图标丢失你 记录一下解决办法: webpack module配置:(build目录下 ...
- Vue+elementUI build打包部署后字体图标丢失问题
错误描述:Vue+elementUI build打包部署后字体图标丢失,控制台显示文件element-icons.woff和element-icons.ttf文件404 错误展现: 控制台报错截图 ...
随机推荐
- 【转】Ubuntu 64位系统安装交叉编译环境一直提醒 没有那个文件或目录
安装交叉编译环境搞了一个晚上 一直提示 root@zqs-pc:~# arm-linux-gcc/usr/local/arm/4.3.2/bin/arm-linux-gcc: 行 3: /usr/lo ...
- Palindrome Function HDU - 6156(数位dp)
要求m-n内在l-r进制下的是回文数的总个数. dp[进制][从第j为开始][目前到达第k位] = 总的方案数 dfs枚举目前的到达的位置,这个数开始的位置,进制,前导零,限制条件,然后枚举的时候如果 ...
- POJ--3190 Stall Reservations(贪心排序)
这里 3190 Stall Reservations 按照吃草时间排序 之后我们用 优先队列维护一个结束时间 每次比较堆顶 看是否满足 满足更新后放到里面不满足就在后面添加 #include<c ...
- JavaServer Faces (JSF) with Spring
JavaServer Faces (JSF) with Spring Last modified: April 30, 2018 by baeldung Spring+ Spring MVC JSF ...
- IO 流读取文件时候出现乱码 文件编码格式问题 怎么转换解决方法
在使用下面这个写法时候UTF-8文件编码 在读取时候出现乱码问题. File myFile=new File("文件路径"); BufferedReader in = new Bu ...
- iconv: iconv_open(pToCharset, pFromCharset); 的附加参数//IGNORE
今天在转换一个文件时iconv() 老是返回 -1, 提示编码转换失败. 一共 30 多个文件, 原编码都是一样的,为什么有的转换会失败,返回 -1呢? 网上搜索了一下, 找到一个随加参数: //IG ...
- YSLOW(一款实用的网站性能检测工具)
概述 YSlow是Yahoo发布的一款基于FireFox的插件,这个插件可以分析网站的页面,并告诉你为了提高网站性能,如何基于某些规则而进行优化. 安装 官网:http://yslow.org/ ...
- POJ 2553 The Bottom of a Graph (Tarjan)
The Bottom of a Graph Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 11981 Accepted: ...
- (数学) PTA 1005 继续(3n+1)猜想 (25 分)
1005 继续(3n+1)猜想 (25 分) 卡拉兹(Callatz)猜想已经在1001中给出了描述.在这个题目里,情况稍微有些复杂. 当我们验证卡拉兹猜想的时候,为了避免重复计算,可以记录下递推过程 ...
- vue实现购物车和地址选配(二)
参考文献: vue官网: vue.js 效果展示:全选和取消全选,计算总金额 项目源代码:https://github.com/4561231/hello_world 项目核心代码实现及踩坑 1.全选 ...