React-native使用过程中遇到的一些坑

1、部分android手机Text标签展示不全(比如设置标签内容为 1234, 只展示123)或者不展示 特别是1加手机
      解决方法:通过设置字体来解决,rn里有写好的样式CommonStyles.priceFontStyle 


2、给一个标签重复设置key,android上会报错
      解决方法: 避免重复设置key


3、isTrue & ...... 当isTrue为"", android上返回""会报错
     解决方法:

      1> isTrue强制转换为boolean   
      2> 用三元表达式写法  isTrue ? ...... : null

 

4、image放在text标签里,部分android上展示的区域远远小于设置区域

     例如: width: 100, height: 50 

     解决方法:

       const multiple = **.isIOS() ? 1: PixelRatio.get();
       width = width * multiple;
       height = height * multiple;

5、SwipeListView 出现自动侧滑问题.

       SwipeListView useFlatList时候出现自动侧滑问题. 或者第一屏加载刷新多次问题 

       可以解决:

          需要注意key, 用keyExtractor 指定key的生成规则 

6、m站编译时的warning提示如下:

There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:

引发的场景: 引入文件的时候出现了不同的名字,或者大小写不一致  例如:

import Base64 from 'utils/base64';

import Base64 from 'utils/Base64';

解决方法: 修改一致即可解决

7、textinput在 android手机上value展示不全
解决方法: padding水平垂直方向均设置为0

 

8、ios中的埋点的弹框,模拟器中拖动失效,会挡住页面的元素,不能操作。

拖动方法:1、 左手三个手指按住触摸板,右手按住左键拖动

                  2、鼠标左键长按,2秒后可以拖动


9、android机Text标签设置selectable=true时仍不能复制文本。

这种情况是当Text在flatlist中时出现,解决方法是设置一个key={Math.random()},https://github.com/facebook/react-native/issues/14746

你可能感兴趣的:(前端)