React Native基础知识

React Native是一个使用Javascript和React来编写跨终端移动应用（Android或iOS）的一种解决方案。跨平台移动应用开发框架。

React Native相对于原生iOS、Android有哪些优势？

1.性能方面媲美原生App

2.绝大部分代码同时适用IOS/Android，一套代码两系统适用。

3.使用Javascript编码，上手容易

4.组件式开发，易于管理维护，代码复用率高。

5.代码更改后会自动刷新，节省等待时间。

6.支持热更新，更新无需重新安装App。

React Native组件的生命周期

和react组件的生命周期一致。

react-native常用组件

View: 创建UI时最基础的组件，View是一个支持Flexbox布局、样式、触摸响应、和一些无障碍功能的容器。View在设计上可以嵌套使用。

Text：用于显示文本的React组件，也支持嵌套、样式以及触摸处理。

Image：用于显示多种不同类型图片的React组件，包括、react组件，包括网络图片、静态资源、临时的本地图片、以及本地磁盘上的图片（如相册等）。

两种引入图片方式：

1.require相对路径方式加载 <Image source={require('./img/logo.png')} />

 2.使用url加载网上图片资源 <Image source={{uri:'http:..............jpg'}} />

ImageBackground：可以设置背景图片，使用方法与Image一致。

TextInput：允许用户在应用中通过键盘输入文本的基本组件。本组件的属性提供了多种特性的配置，譬如自动完成、自动大小写、占位文字，以及多种不同的键盘类型（如纯数字键盘）等等。最简单 的用法就是丢一个TextInput到应用里，然后订阅它的onChangeText事件来读取用户的输入。

TouchableOpacity：本组件用于封装视图，使其可以正确响应触摸操作。当按下的时候，封装的视图的不透明度会降低。

ScrollView：一个封装了平台的ScrollView（滚动视图）的组件，同时还集成了触摸锁定的“响应者”系统。ScrollView必须有一个确定的高度才能正常工作，因为它实际上所做的就是将一系列不确定高度的子组件装进一个确定高度的容器（通过滚动操作）。一般来说我们会给ScrollView设置flex:1以使其自动填充父容器的空余空间，但前提条件时所有的父容器本身也设置了flex或者指定了高度，否则会导致无法正常滚动。

 

 属性：contentContainerStyle  这些样式会应用到一个内层的内容容器上，所有的子视图都会包裹在内容容器内。

属性： showsHorizontalScrollIndicator      当此属性为 true 的时候，显示一个水平方向的滚动条。

属性：horizontal        当此属性为 true 的时候，所有的子视图会在水平方向上排成一行，而不是默认的在垂直方向上排成一列。默认值为 false。

属性：scrollEnabled        

当值为 false 的时候，内容不能滚动，默认值为 true。

注意即便禁止用户滚动，你也仍然可以调用scrollTo来滚动。

StyleSheet：实现了类似Web中CSS样式表的功能。

React Native 存储数据组件AsyncStorage

AsyncStorage是一个简单的，未加密的，异步的，持久的键值存储系统。

AsyncStorage是一个全局的存储系统，没有实例这一概念，要存储数据就往里面扔，要读取数据就发起请求。

AsyncStorage对外提供了简单 的Javascript接口。每一个接口都是异步的，每一个接口都返回一个Promise对象。