1. 程式人生 > >React Native之內部方法常用幾種寫法和呼叫規則

React Native之內部方法常用幾種寫法和呼叫規則

1 簡單部分程式碼

export default class App extends Component<Props> {
  render() {
    return (
        <View style={styles.container}>
	    <View style={styles.welcome}>
                <Button onPress={this.showMsg}title='prees me showMsg'/> 
		<Button onPress={() => {this.showMessage()}}title='prees me showMessage'/> 
            </View>
        </View>
    );
  }
    //記得這裡呼叫的時候不需要加上()
    showMsg(){
	alert("showMsg(){}");  
    }
    
    //記得末尾加上分號,呼叫的時候也要加上()
    showMessage = () => {
        alert("showMessage = () => {}");
    };
}

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

2 分別點選上面程式碼的2個按鈕效果如下