rn 基础设置解析

1、引入react
	 import React from 'react'

2、从rn导入组件，只能使用导入的组件替代html标签,不能使用其他如div等标签
	import {
		//样式组件,通过它来create样式
		StyleSheet,
		//视图组件,类似div
		View,
		//文本组件,放置文本内容
		Text
	} from 'react-native'

3、定义函数式组件,类组件的使用和react一样
const App=()=>{
	return (
	//<></>为根组件,可换成View来代替
		<>
		//xxx为通过StyleSheet来create出的样式对象,xx为包含样式的属性对象
			<View style={xxx.xx}>
	            <Text>
	                hello world
	            </Text>
	        </View>
		</>
	)
}

4、定义样式对象
	const xxx=StyleSheet.create({
		xx:{
			样式
			‘-’换成驼峰命名法
		}
	})

5、导出组件
export default App;

代码示例:

import React from 'react';

//导入后才能使用这些组件，不能使用额外的组件如div等
import {
    //样式对象
    StyleSheet,
    //视图组件,类似div,默认弹性布局
    View,
    //文本组件,放置文本内容
    Text
} from 'react-native'

//定义一个函数式组件
const App=()=>{
  return (
    <>
        <View style={styles.view}>
            <Text>
                hello world
            </Text>
        </View>
    </>
  ) 
}

//定义样式对象
const styles=StyleSheet.create({
    view:{
        height:200,
        width:200,
        //驼峰命名
        backgroundColor:'rgba(200,255,0,0.5)'
    }
});

export default App;