react-native踩过的坑

包管理

添加新的第三方包总会遇到各种问题,不是版本不对就是运行不起来,记录下遇到的问题:

Error: Cannot find module ‘xxx’

module.js:340
throw err;
^
Error: Cannot find module 'xxx'

这个问题若不是没引用包就是需要关联下依赖:

npm install -d

MainApplication.java:5: 错误: 程序包xxx.xxx.xx不存在

如果这个找不到的第三方包不是纯js包,那很有可能是没有link到Android和iOS项目中:
在React Native 0.27+版本中运行:

react-native link xxx-xxx-xx

如果是其它React Native旧版本,需要安装rnpm (npm install -g rnpm)

rnpm link xxx-xxx-xx

也可以手动link,例如在Android中先要将项目添加到 setting. gradlebuilde.gradle 然后再在MainApplication.java 中的 getPackages() 方法中添加对应的包对象实例到List中。

undefined is not a function (evaluating ‘React.createClass’)

找不到这个方法,是不是React的版本是 ^16.0.0-beta.5,修改版本为 ^16.0.0-alpha.12 就好了:

npm install react@^16.0.0-alpha.12 --save

高版本去掉了这个方法和React.PropTypes,所以这两个地方报错,检查代码,或者检查第三方包,选择修改代码或者回退React版本。

react-navigation

Android的标题不居中

Android中,默认情况下,title是靠左,紧靠返回按钮的,可以通过在stackConfig中添加下面的代码来居中:

        navigationOptions: {
            ...
            headerTitleStyle: {
                ...
                alignSelf: 'center'
            },
            ...
        },

如果没有左侧返回按钮或者右侧按钮,标题文字可以居中,但是那种有返回按钮的页面中,会导致title整体向右偏移,所以可以在右侧设置一个View,来让title居中:

    static navigationOptions = ({navigation}) => ({
        headerTitle: '标题',
        headerRight: (
            <View/>
        ),
    });

这个问题可以关注Android Header Text Not Centered

持续更新React-Native遇到的坑。。。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值