反應原生getInitialState（）語法錯誤（意外的令牌）

Question

我似乎無法弄清楚爲什麼這段代碼給了我一個語法/意外令牌錯誤在行14.任何幫助將不勝感激。

我敢肯定，getInitialState（）設置正確，不知道爲什麼它會拋出一個錯誤。

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

export default class Test extends Component { 
    getInitialState() { 
    return { 
     test: '' 
    }; 
    }, 

    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      {this.state.test} 
     </Text> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
}); 

AppRegistry.registerComponent('Test',() => Test); 

Answer 1

您正在混合ES5寫反應組件的方式與ES6（ES2015）寫反應組件的方式。瞭解更多關於在這裏https://facebook.github.io/react/docs/react-without-es6.html

解決您的代碼，修改如下

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

export default class Test extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     test: '' 
    }; 
    } 

    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      {this.state.test} 
     </Text> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
}); 

AppRegistry.registerComponent('Test',() => Test);