react native 学习笔记1

1.Getting Started
npm start -- --reset-cache
2.Learn the Basics
import, from, class, extends, () =>,渲染的时候只能有一个节点，组件首字母大写，这些都和react一样
AppRegistry：使用前需要引入import { AppRegistry } from 'react-native';
AppRegistry.registerComponent('AwesomeProject', () => HelloWorldApp);
告诉 React Native整个应用中谁是根组件，如果是用Create React Native App方式创建，则不用写。
基本组件<Text><Image><View>
Text写文字，Image引入图片（source类比href），View相当于div
使用前需要引入import { Text, View,Image } from 'react-native';
3.props和state：和react一样
4.style
使用前需要引入import { StyleSheet } from 'react-native';
用StyleSheet.create()创建

            const styles = StyleSheet.create({
                   red: {
                   color: 'red',
                   },
                   bigblue: {
                   color: 'blue',
                   fontWeight: 'bold',
                   fontSize: 30,
               },
           });

引用的格式（两个style要用数组）

     <Text style={styles.red}>just red</Text>
     <Text style={[styles.bigblue, styles.red]}>bigblue, then red</Text>

5.Height and Width
普通：直接在style={{ width: 50, height: 50, }}里面写尺寸，只用数字表示，无单位
flex布局：在可用的空间里动态的扩张、收缩。
在react native中默认从上倒下 按列方向排列。
父节点下面的子节点里面：当所有的子节点flex: 1，代表这些子节点共享全部可用空间 ，他们等额分配这些空间。这些兄弟节点间相比flex值越大，占得份额越重，空间越多。