React native 知识点整理之基础概念

﹏ヽ暗。殇╰゛Y 2022-12-08 14:25 164阅读 0赞

[基础组件和API][API]

##### 基础概念部分 #####

1.  RN的起源，开发特点：

> 起源：2015年3月26日，Facebook公司对外正式发布了ReactNative—使用React框架跨平台开发原生移动应用的开源技术框架(ReactNative经常被简称、简写为RN)。开发者可以使用ReactNative高效地开发运行于Android与iOS操作系统的应用程序。它的设计理念是:使用ReactNative开发，既拥有Native的良好人机交互体验，又保留了React框架的开发效率。  
> 特点：  
> 1.一次学习，随处编写  
> 2.混合开发  
> 3.高效的移动应用开发  
> 4.高效的移动应用开发调试  
> 5.灵活高效的应用热更新  
> 6.有效降低移动应用安装包体积  
> 7.学习门槛低、开发难度低;  
> 8.开发软硬件要求低

1.  创建并运行一个RN项目的步骤

> react-native init 项目名称  
> 根目录react-native start  
> react-native run-android

1.  RN程序基本结构

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ0NzY4NTY0_size_16_color_FFFFFF_t_70_pic_center]

1.  RN代码的注释方法

react jsx{ /**/}
    css 注释 /*这里是注释*/
    js  注释 单行注释采用 //这里是注释,
             多行注释采用 /*这里是注释*/

1.  状态机思维（状态和属性）

> 根据决定状态的状态机变量的值,React框架渲染出状态机的当前状态 对于无状态的React Native组件来说，会被改变的数据来自于它的props(属性);而对于有状态的React Native组件来说,会被改变的数据不仅来自于它的props,还来自于它的state(状态机变量）。尽可能让自定义的React Native组件成为无状态的React Native组件。

> ##### props与state的不同： #####
> 
> 通俗理解：一个只可读(props)，一个可读可写(state)

> props是组件自身的属性，一般用于嵌套的内外层组件中，负责传递信息（通常由父层组件向子层组件传递）props对象中的属性与组件的属性一一对应，不要直接去修改props中的属性的值。

> state是组件持有的状态。如果想要修改组件持有的状态或者叫属性，那么就应该用state来更改。一般情况下，我们需要在constructor构造方法中进行初始化state，然后在想要修改更新的时候调用setState方法。

1.  RN中颜色类型的值的表示

> 1.在简单的开发调试中，开发者经常使用white、grey、black、red、green这种英文颜色单词。  
> 2. “rgba(52,52,52,0.5)”是一个RGBA 色值的描述，还可以使“OxF5FCFFO1”格式表示，  
> 3. “\#F5FCFF”、“rgb(245,252,255)”

1.  按顺序写出组件生命周期函数

constructor 
     componentWillMount 
     componentDidMount 
     componentWillReceiveProps 
     shouldComponmentUpdate 
     componmentWillUpdate 
     componmentDidUpdate 
     componmentWillUnmount

1.  读取json文件的方法

> JSON文件的文件名后缀必须是小写的。  
> 当我们需要使用JSON文件中的数据时，  
> 在代码中加入: let constantData = require(’ ./data/SimpleExample.json’ );  
> 现在就可以将constantData变量作为一个类的对象来使用了。

1.  RN中数据持久化操作的实现方式

> 数据持久化是指应用程序将某些数据存储在手机存储空间中。React Native框架不支持调用JavaScript的fs包进行文件读写操作。React Native框架为开发者提供了AsyncStorageAPI，开发者可以利用它将任意“字符串键值对”保存到存储空间中，也可以通过键值将指定的字符串值从 存储空间中取出。

1.  RN设计的5大步骤

> 一、应用原型  
> 二、基础组件结构设计  
> 三、使用React Native组件搭建静态界面  
> 四、React Native组件分层  
> 五、实现各组件业务逻辑

1.  RN导航器的种类

> 标签导航 抽屉式导航 站式导航

1.  RN进行网络访问的方法

> 使用React Native框架开发时，可以使用NetInfoAPI来获取手机当前的各个网络状态。  
> React Native框架集成了最新的Fetch API，开发者可以使用Fetch API灵活高效地进行HTTP与HTTPS通信。  
> React Native框架还支持较新的WebSocket协议，开发者可以通过它与服务器进行全双工的通信。

[API]: https://blog.csdn.net/qq_44768564/article/details/108692104
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ0NzY4NTY0_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/1116446bf7b54c188a395c5119ffd831.png