全局环境:

react-native-cli: 2.0.1

react-native: 0.55.1

package.json 

{

  "name": "imoocApp",

  "version": "0.0.1",

  "private": true,

  "scripts": {

    "start": "node node_modules/react-native/local-cli/cli.js start",

    "test": "jest"

  },

  "dependencies": {

    "mockjs": "^1.0.1-beta3",

    "react": "16.3.1",

    "react-native": "^0.55.1",

    "react-native-vector-icons": "^4.6.0"

  },

  "devDependencies": {

    "babel-jest": "22.4.3",

    "babel-preset-react-native": "4.0.0",

    "jest": "22.4.3",

    "react-test-renderer": "16.3.1"

  },

  "jest": {

    "preset": "react-native"

  }

}

报错信息:The <Image> component cannot contain children. If you want to render content on top of the image, consider using the <ImageBackground> component or absolute positioning

说明新版本 Image 不支持 包含子标签 ,所以只要把 Icon 抽离出Image即可

<TouchableHighlight >

              <View style={styles.item}>

                <Text style={styles.title}>{row.title}</Text>

                <View style={{ flex: 1,position: 'relative'}}>

                  <Image

                    source={{uri: row.thumb}}

                    style={styles.thumb}

                  />

                    <Icon

                    name='ios-play'

                    size={28}

                    style={styles.play} />

                </View>

                <View style={styles.itemFooter}>

                  <View style={styles.handleBox}>

                    <Icon

                      name='ios-heart-outline'

                      size={28}

                      style={styles.up} />

                    <Text style={styles.handleText} >喜欢</Text>

                  </View>

                  <View style={styles.handleBox}>

                    <Icon

                      name='ios-chatboxes-outline'

                      size={28}

                      style={styles.commentIcon} />

                    <Text style={styles.handleText}>评论</Text>

                  </View>

                </View>

              </View>

            </TouchableHighlight>