Hubert's Coding Journey

1. Some Legacy APIs are Deprecated

We are no longer able to require some of react-native components directly:

var PropTypes = require('ReactPropTypes');
var ImageStylePropTypes = require('ImageStylePropTypes');
var createReactNativeComponentClass = require('createReactNativeComponentClass'); (use requireNativeComponent  instead)

Now we need to import them from 'react' or 'react-native' module:

import React, {
  Component,
  PropTypes,
} from 'React';

import {
  requireNativeComponent,
  StyleSheet,
  Image,
  View,
} from 'react-native';
 

If your native view component has custom properties, remember to add settings to your js layer:

var NativeImageView = requireNativeComponent('CustomView', CustomView, {nativeOnly: {
  property1: true,
  property2: true,
}});

or it will it may complaint that your compoennt does not has the properties of sepecific type.

2. Behavior of Flex-Wrap Changed

The behavior of flex-wrap has changed, it no longer behaved as we expected now.

When we set a container to flex-wrap, there will be extra paddings added to the items in the container.

For detail, please check this issue https://github.com/facebook/react-native/issues/8960

According to the article above, add alignItems: 'flex-start' will solve the issue of flex-wrap.