React Native 中的坑

复合组件无法在 TouchableOpacity 使用

<TouchableOpacity>
        <MyButton label="Press me!" />
</TouchableOpacity>

会报 Touchable child must either be native or forward setNativeProps to a native component ,这是因为:

If you run this you will immediately see this error: Touchable child must either be native or forward setNativeProps to a native component. This occurs because MyButton isn’t directly backed by a native view whose opacity should be set. You can think about it like this: if you define a component with React.createClass you would not expect to be able to set a style prop on it and have that work - you would need to pass the style prop down to a child, unless you are wrapping a native component. Similarly, we are going to forward setNativeProps to a native-backed child component.

解决办法就是在 MyButton 组件中添加

setNativeProps(nativeProps) {
    this._root.setNativeProps(nativeProps);
  }

其中 this._root 代表组件的引用

0.29/0.30 中 flexDirection: row 布局异常

改动前:

 imageContainer: {
    flexDirection: 'row',
    flexWrap: 'wrap'
  }

改动后:

 imageContainer: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    alignItems: 'flex-start'
  }

引入 moment.js

参考 facebook/react-native#1629

import moment from 'moment';
import momentLocale from 'moment/locale/zh-cn';
...
moment.updateLocale('zh-cn', momentLocale);