本周遇到几个有意思的问题。下面一一记录。
(css)使用flex布局,如何保证上下行之间间距,并且最后一行和容器空间为0
元素之间使用margin-bottom保持距离,最后一行元素的距离,使用外层的负margin抵消
(react)如何理解组件里面的普通函数和箭头函数
参考:https://www.zhihu.com/question/59025982
简单来说:
普通函数
Foo.prototype.a = function(){}
箭头函数
class Foo { constructor() { this. a= () => {} } }
普通函数挂载在原型上面,箭头函数挂载在对象上面。使用箭头函数绑定不需要使用
bind
,比较方便。react native
keybordWillShow
安卓是监听不到的,statusbar
中barStyle
在安卓上面也可以用,需要安卓6.0+react-navigation
页面销毁:
a->b :不会执行页面销毁事件
b返回a:执行b页面销毁事件
前端处理emoji表情 😀
正常应该数据库保存emoji表情,数据库使用
utf8mp4
,最完美的解决方案。但是有时候,数据库是以前的,不可能变更,这时候前端可以把emoji转成utf-16,然后传给后端。可以直接使用umoji的
emojiToUnicode
方法。
验证utf-16是否正确:https://www.browserling.com/tools/utf16-decode
前端如何解析这个utf-16 呢?https://www.jianshu.com/p/432425a02b59
编码解码函数:
// 编码
function utf16toEntities(str) {
var patt=/[\ud800-\udbff][\udc00-\udfff]/g; // 检测utf16字符正则
str = str.replace(patt, function(char){
var H, L, code;
if (char.length===2) {
H = char.charCodeAt(0); // 取出高位
L = char.charCodeAt(1); // 取出低位
code = (H - 0xD800) * 0x400 + 0x10000 + L - 0xDC00; // 转换算法
return "&#" + code + ";";
} else {
return char;
}
});
return str;
}
// 解码
function uncodeUtf16(str){
var reg = /\&#.*?;/g;
var result = str.replace(reg,function(char){
var H,L,code;
if(char.length == 9 ){
code = parseInt(char.match(/[0-9]+/g));
H = Math.floor((code-0x10000) / 0x400)+0xD800;
L = (code - 0x10000) % 0x400 + 0xDC00;
return unescape("%u"+H.toString(16)+"%u"+L.toString(16));
}else{
return char;
}
});
return result;
}
但是但是,我解析的时候直接JSON.parse(emoji)
也是可以的….试了偏僻的字符也可以,想搞明白为什么,没有找到文章=-=,不知道是埋了炸弹,还是狗屎运/(ㄒoㄒ)/~~