reactNative - Component

import { View, Text, StyleSheet ,TouchableOpacity, TouchableWithoutFeedback, Button  } from 'react-native';

1. View, Text

1) View

- 다른 컴포넌트들을 감싸는 역할

- vue 태그 안에 여러 vue태그를 넣을 수 있다.

2) Text

- 그냥 텍스트

 

2. StyleSheet

1) inline

class App extends Component {
	render() {
    	return (
          // 객체를 넣음
          <View style={styles.exStyle}>

          // 이게 JSX넣은건가봄
          <View style={{
              backgroundColor: 'white'
              marginTop: 10
          }}>
        )
    }
}

const styles = StylesSheet.create({
	exStyle: {
    	backgroundColor: pink,
        flex: 1
    }
})

- 괄호 1개는 JSX를 담고, 괄호 2개는 객체를 담는다.

 

3. TouchableOpacity, TouchableWithoutFeedback

- 둘 다 Touch Event 주는 것.

1) TouchableOpacity

: 터치시 잠깐동안 투명함

2) TouchableWithoutFeedback

: 터치시 투명해지는것이 없음.

 

4. Button