ReactNative学习笔记(五)踩坑总结

已经发现的bug或者问题

  • Android不支持shadow属性;
  • Animated.Image的borderRadius不生效;
  • setNativeProps无法修改图片的source;
  • 没有直接设置组件显示与隐藏的属性,只能变相实现;
  • require加载图片不能是变量或者拼接的字符串;
  • require加载json也是一样,也不支持动态加载;
  • 图片拉伸时默认效果是cover,而不像html中的stretch;
  • 开启远程调试时动画非常卡,甚至可以说卡到看不到动画效果;

debug模式和release模式的区别

JS引擎的不同

原文见这里

  • 在iOS、Android的模拟器或是真机上,React Native使用的是JavaScriptCore,也就是Safari所使用的JavaScript引擎。但是在iOS上JavaScriptCore并没有使用即时编译技术(JIT),因为在iOS中应用无权拥有可写可执行的内存页(因而无法动态生成代码)。
  • 在使用Chrome调试时,所有的JavaScript代码都运行在Chrome中,并且通过WebSocket与原生代码通信。此时的运行环境是V8引擎。

JSON解析时的编码问题

有如下简单的JSON文件,UTF-8编码,内容没有中文,并且header设置了application/json;charset=UTF-8

{
"update": true,
"url": "http://192.168.191.1/update/bundle.zip"
}

加载代码如下:

fetch('http://192.168.191.1/update/check_update.json')
.then((response) => response.json())
.then((json) => alert(json))
.catch((error) => alert('错误:'+error));

debug模式下没有任何问题,但是打成release包时却报错:

ReactNative学习笔记(五)踩坑总结

代码改成这样也一样:

fetch('http://192.168.191.1/update/check_update.json')
.then((response) => response.text())
.then((text) => JSON.parse(text))
.catch((error) => alert('错误:'+error));

最后把文件改成ANSI编码就没问题了,真是醉了!

热更新问题

更新index.android.bundle必须打成release包并重启才能看到效果。

上一篇:jQuery实现无缝滚动条


下一篇:Linux 上安装 Node.js