在 React Native 中与 <image > 标记一致的意外标记

Question

<Image source={require('./cat.jpeg')}/>

我在 render 函数中有这一行，当我运行代码时，我收到错误 Unexpected token at this line.How 来解决这个问题？图像 cat.jpeg 与当前组件位于同一文件夹中。

完整代码如下：

'use strict'
import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Navigator,
  Text,
  View,
  Image
} from 'react-native';

import { Actions } from 'react-native-router-flux';


export default class HomeScreen extends Component{



  render() {
    return (
            <View style={styles.container}>
            <View style={styles.rowcontainer}>
            // <Image style={{width: 50, height:50}}
            // source={{uri: 'https://facebook.github.io/react/img/logo_small.png'}}/>
            <Image source={require('./cat.jpeg')}/>

            <Text onPress={Actions.MarkAttendance}style={styles.welcome}>
          Mark Attendance
        </Text>


        <Text onPress={Actions.AttendanceDetails}style={styles.welcome}>
          View Attendance
        </Text>

        </View>

        <View style={styles.rowcontainer}>

        <Text onPress={Actions.Test}style={styles.welcome}>
          Test
        </Text>


        <Text onPress={Actions.NewActivation}style={styles.welcome}>
          New Activation
        </Text>

        </View>
        <View style={styles.rowcontainer}>

        <Text onPress={Actions.PendingAttendance}style={styles.welcome}>
          Pending Attendance
        </Text>


        <Text onPress={Actions.Checkout}style={styles.welcome}>
          Checkout
        </Text>

        </View>
        <View style={styles.rowcontainer}>

        <Text onPress={Actions.Settings}style={styles.welcome}>
          Settings
        </Text>

        <Text style={styles.welcome}>
          Logout
        </Text>

        </View>
        </View>
       )

  }


}


var styles = StyleSheet.create({
  container: {
    flex: 1,
    marginTop:50,
    backgroundColor: '#FFFFFF',
  },
  rowcontainer:{
    alignItems:'stretch',
    flexDirection:'row',
    justifyContent:'space-between',
    margin: 10,
  },
  welcome:{
    fontSize:15,
  }
});

Answer 1

在使用 HTML-like 语法时，您不能使用 // 注释掉渲染函数内的代码片段。相反，请尝试将您要注释掉的任何内容包装在 {} 中并在那里使用 javascript 块注释。
例如

{/*
    <Image
        source=.../>
*/}

在 React Native 中与 <image > 标记一致的意外标记

Unexpected token at line with <image > tag in React Native

react-native

react-native-android

react-native-image