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 错误展现: 控制台报错截图 ...
随机推荐
- MT【265】a+b,ab
已知$a+b=1$,求$(a^3+1)(b^3+1)$的最大值_____ $(a^3+1)(b^3+1)=a^3+b^3+a^3+b^3+1$ $=(a+b)^3(a^2+b^2-ab)+a^3b^3 ...
- THUSC2017题解
THUSC2017题解 题目都是在LOJ上交的. chocolate LOJ#2977巧克力 这题看着就让人想起了百度之星复赛的\(T5\),就是这题. 因为种类的个数很多,所以把每个种类随意\(ra ...
- [bzoj2288][pojChallenge]生日礼物【贪心+堆+链表】
题目描述 ftiasch 18岁生日的时候,lqp18_31给她看了一个神奇的序列 A1, A2, -, AN. 她被允许选择不超过 M 个连续的部分作为自己的生日礼物. 自然地,ftiasch想要知 ...
- Expand the scale swarm 副本增减实现负载均衡
#创建好了swarm集群后,我们可以部署一个httpd应用来了解工作情况:#执行以下命令来部署应用: docker service create --name web_server httpd --n ...
- default.conf
1./etc/nginx/conf.d/ 下设置一个 default.conf,server_name 设置为 localhost,如果有其他非法域名 A 记录到该机器上,则返回默认的 Nginx 页 ...
- MD5加密解密类(asp.net)&使用MD5过时处理
加密类 #region ========加密======== /// <summary> /// 加密 /// </summary> /// <param name=&q ...
- django orm 重点大全
1.最简单的跨表,查询外键表中符合主表条件的记录列表 #用户类型表 class User_typ(models.Model): name=models.CharField(max_length=32) ...
- 第二十八篇-Fragment静态用法
效果图: 首先,先大致布局成这个形状 看动画中,横看分为两个区域,所以整体是一个水平排列 设置外层LinearLayout的参数 android:orientation="horizonta ...
- Day4--Python--列表增删改查,元组,range
# 一.列表# 能装东西的东西 列表中装的数据是没有限制的,大小基本上够用# 列表用[]表示# 有索引和切片 [start,end,step] ###增删改查 (重点) # 1.新增 # appent ...
- 高级组件——文件选择器JFileChooser
1.创建文件选择器 JFileChooser 2.设置选择模式 setFileSelectionMode(int mode) JFileChooser.FILES_ONLY 只能选择文件(默认) JF ...