昵称的emoji的尝试性解决⽅案
概述
之前分享过,讨论了前端页⾯使⽤emoji的⽅法,但是昵称中的emoji怎么获取和显⽰呢?我查了⼀些资料,把⼼得记录下来,供以后开发时参考,相信对其他⼈也有⽤。
转码问题
这⾥借鉴的源码,我总结了emoji的转码⽅法。
形式的emoji转Unicode,使⽤下⾯的emojiToUnicode函数即可。昵称代码转换
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="emoji"></div>
<div id="haha"> </div>
<script>
function emojiToUnicode(emoji) {
var backStr = ""
if(emoji&&emoji.length>0){
for(var char of emoji){
var index = dePointAt(0)
if(index>65535){
var h = '\\u'+(Math.floor((index - 0x10000) / 0x400) + 0xD800).toString(16);
var c = '\\u'+((index - 0x10000) % 0x400 + 0xDC00).toString(16)
backStr = backStr + h + c
}else{
backStr = backStr + char
}
}
console.log(backStr)
}
return backStr
}
var test = emojiToUnicode(document.querySelector('#haha').innerHTML);
document.querySelector('#emoji').innerHTML = test;
</script>
</body>
</html>
Unicode转 形式的emoji,使⽤decodeURI()⽅法即可:
console.log(decodeURI('\ud83c\udf50\ud83d\udc36\ud83c\udf50'));
图⽚显⽰
在讨论之前可以先看⼀下我的上⼀篇博⽂:,我们这⾥使⽤的是博⽂中介绍的第⼆个库。
这个库有3个问题需要解决:
1.库⾥⾯使⽤了jquery,但是移动端⼀般使⽤zepto。经过测试,把⾥⾯的jquery换成zepto就可以了。
2.库⾥⾯的图⽚解码不全。可以看⼀下它的,可以看到,它的解码主要依靠EMOJI_MAP对象,⽽这个对象下⾯有⼀部分emoji图⽚的解码还不完整,需要补充。
3.这个库没有解决类似[捂脸]这种汉字形式的emoji代码。这个就需要⾃⼰补充了。
所以综合⼀下,如果项⽬确实需要显⽰昵称中的emoji的话,建议还是⾃⼰写⼀个库。
其它库
如果想要在⼩程序,或者vue,react⾥⾯使⽤emoji的话,建议还是去vue-emoji或者react-emoji这种库⽐较好。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论