React Native学习二

一 React Native 组件的生命周期

在React Native项目中,所有展示的界面都可以看做是一个组件(Component),例如在BugShop 项目中的 app.js中

import React,{ Component } from 'react';

import {
AppRegistry,
StyleSheet,
Text,
TextInput,
Button,
View,
ScrollView,
Platform,
Dimensions
} from 'react-native';

export default class buyShop extends Component

最常用的加载和卸载的函数调用流程如下图





StatusBar 组件常用属性的平台兼容性:

animated 和hidden属性在iOS、Android平台都有效

backgroundColor 和 translucent 属性只在Android平台有效。

barStyle、networkActivityIndicatorVisible以及showHideTransition属性只在iOS平台有效。

二、移植项目

首先 AppRegistry 是所有的React Native 应用的入口,应用的根组件通过AppRegistry.registerComponent方法注册自己,然后原生系统才可以加载 React Native 应用的代码并运行项目流程图如下:


1.更改 index.ios.js


2.复制 app.js到新项目的目录

3.用Xcode打开新项目,运行后:

根据根视图加载原理进行修改后再次运行

代码片段:https://github.com/kangxg/React-Native-.git

运行成功,接下来就进行修改进行电商项目的开发!

相关文章

一、前言 在组件方面react和Vue一样的,核心思想玩的就是组件...
前言: 前段时间学习完react后,刚好就接到公司一个react项目...
前言: 最近收到组长通知我们项目组后面新开的项目准备统一技...
react 中的高阶组件主要是对于 hooks 之前的类组件来说的,如...
我们上一节了解了组件的更新机制,但是只是停留在表层上,例...
我们上一节了解了 react 的虚拟 dom 的格式,如何把虚拟 dom...