最近，由于与官网的版本差距太大，我们决定对项目源码进行升级处理，，下面简单说下，升级过程中遇到的问题。
第一步：react-native init 获取最新react native 版本。
第二步：打开init 的工程，在package.json 中添加需要的第三方库。
第三步：打开iOS文件下.xcodeproj 文件，配置项目需要的库。
第四步：把原来的业务代码，按照原来的路径复制到新建的工程中。
一二步，没有什么多说的。具体遇到问题，在做说明（下面会提到）。简单说下第三步中，遇到的坑（其实是自己粗心所致），由于iOS9及以上，访问网络需要HTTPS 方式。我们项目中从外网访问DMZ区，是HTTPS方式，但是内部服务器到DMZ的访问方式是HTTP, 所以需要在 info.plist 中做下简单的处理。如下图： 在安全传输设置中，允许任意访问。
由于我们测试环境用的都是HTTPS方式，在最后切换到生产环境时，突然发现网络无法访问，刚开始以为是生产环境挂掉了，用上个月的APP访问发现一切正常，好吧，我们才想起来，忘记修改info.plist了。当然这些都是升级完成后，发现的问题。下面说说，升级时，遇到的问题。
我们在做好第一二步时，运行APP，竟然成功了，我自己都感到诧异，难道就这么简单，然后登录到下个页面，我去，什么情况Xcode 报错....,好吧，终于报错了，然后定位问题，发现我们用的图标库有问题，这....顿时觉得好大的坑。我们原来用的是 react-native-icons 现在用react-native-vector-icons 做了替换（定位问题时，方法有点笨，在出问题的页面，把render()里的东西全部注释，然后一点一点的取消注释，找到报错的原因。）
把工程中用到react-native-icons的地方用react-native-vector-icons替换后，程序可以正常运行了，我只能说替换的过程是个很无聊的事，你会发现，好多图标与原来的不一样了。。。。也能理解毕竟是不同的库。运行后发现好多页面显示有问题，有些全乱了，只能慢慢搞了，我就说个简单的 Image 和 View 原来我们项目中有些页面中用到的是下面这种方式
页面显示时，只有图片，里面的内容没了。我们做了下面的修改，用View包裹 Image
刚开始，我一直以为升级只有页面显示的问题，代码逻辑上不会出现问题，只能说 太傻太天真。下面说的这个库更是个大坑。没错就是它lodash，怎么说它是个坑，下面慢慢道来，最新的版本，竟然少了几个方法，例如 join 、mop、split 这也是无力吐槽了，大家更新时用到它的话，一定要格外小心。
当然，我们自己封装的组件也有些地方需要改动，例如我们自己封装的TextInput 最大长度问题，以前是maxLength={200} 外部调用时如果maxLength={300} 则在该页面最大长度是300，升级后发现，如果还是这样的话，最大长度会是200，其实仔细想想，我们这样写是不规范的，现在做了如下修改maxLength={this.props.maxLength} ，又可以愉快的玩耍了，一切正常。当然还有一些封装的组件会有一点小问题，基本上都是显示的问题，flex ：1 像这样的原来是可以的，现在有些地方需要去掉，自己也没搞很明白，看到有人说可以用 flex-grow：1替代。flex 是flex-grow flex-shrink 和flex-basis这三个属性的缩写。其实 flex:1 本质上就等于 flex-grow：1 ，即把伸缩容器的剩余空间占满。
最后再说一下中文乱码的问题，在原来的版本中，是没有乱码问题的，现在乱码问题的出现，在我们的意料之外，既然，问题出现了，就要想办法解决呗，我们后台用的是GBK编码，在react native 0.23.0 时，我们是封装的Fetch 与后台交互，get的请求方式当时没有设置headers，现在添加了get的请求头。如下：
const Fetcher = {
get: (url, callback, failure) => {
const promise = fetch(url,{
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/x-www-form-urlencoded;application/json',
} }); }
问题解决，不过在debug模式下一样乱码，至今没搞明白，然后针对debug,又做了特殊处理。
下面说说post方式，在解决好get中文乱码的方式后，用post 提交，发现依然乱码，顿时凌乱了，
然后尝试也给post添加请求头，发现，后台竟然解析不了.....最后发现，我们对+@#￥%等特殊符号做了两次编码转换，现在只需一次装换即可。
遇到的问题比较有代表性的就这么多，有些小问题就不在这里一一列举了。总之，升级时，不能急躁，遇到问题正常，没遇到问题就不正常了。
网友评论