骑驴找马追骆驼_so的博客

关于React NativeReact Native是利用Facebook现有的业务轮子，达到Natvie的用户体验，保留React的开发效率React Native使用JavaScript和React开发跨平台移动应用React Native提倡组件化开发：即提供了一个个封装好的组件，组件相互嵌套形成新的组件React Native 其实是通过一个虚拟的DOM和iOS中的运行时机制对iOS

一个简单sectionlist的实现 效果代码实现：import React, { Component } from 'react';import { AppRegistry, View, Text, SectionList, TouchableOpacity, StyleSheet,} from 'react-native';var Diemnsions = requ

React Native中开始是ListView,对于下拉、上拉刷新加载等功能，需要额外的添加，ListView被放弃，现在使用FlatListt或是SectionListFlatList用于显示一个垂直的滚动列表，其中样式相同仅数据不同更适于长列表数据，且元素个数可以增删。和ScrollView不同的是，FlatList并不立即渲染所有元素，而是优先渲染屏幕上可见的元素组件必须...

componentDidMount() { this.timer = setInterval( () => {this.activeEvent() }, 500 ); } componentWillUnmount() { // 请注意Un"m"ount的m是小写 // 如果存在

关于ScrollViewScrollView是一个通用的可滚动的控件，可以放入多个组件和视图，而且这些组件并不需要是同类型的。ScrollView不仅可以垂直滚动，还能水平滚动一般使用ScrollView满足俩点即可 ScrollView必须有一个确定的高度才能正常工作 将一系列不确定高度的子组件装进一个确定高度的容器（通过滚动操作） 通常有两种做法： 1、 直接给该ScrollV

获取真实的DOM节点在ReactNative中，可以把组件看成一个“状态机”. 根据不同的status有不同的UI展示。只要使用setState改变状态值，根据diff算法算出来有差以后，就会执行ReactDom的render方法，重新渲染页面但是组件并不是真实的 DOM 节点，而是存在于内存之中的一种数据结构，叫做虚拟 DOM （virtual DOM），只有当它插入文档以后，才会变成真

React-Native生命周期开发中组件免不了要与用户互动，React 的一大创新，就是将组件看成是一个状态机，一开始有一个初始状态，然后用户互动，导致状态变化，从而触发重新渲染 UI。下图为ReactNative中组件的生命周期，根据执行顺序在对应的函数中做对应的操作这张经典的图描述了ReactNative组件从创建、运行到销毁的整个过程，其中经常用到的是创建过程，初始化的时候会调用5个函数，这

关于JSXReact的核心机制之一就是虚拟DOM：可以在内存中创建的虚拟DOM元素React利用虚拟DOM来减少对实际DOM的操作从而提升性能在JavaScript中嵌入XML结构的语法,于是就有了JSX，利用我们熟悉的HTML语法来创建虚拟DOM，在实际开发中，JSX在产品打包阶段都已经编译成纯JavaScript，JSX的语法不会带来任何性能影响关于FlexBox通过弹性的方式来对齐和

可点击的组件高亮触摸 TouchableHighlight当手指点击按下的时候，该视图的不透明度会进行降低同时会看到相应的颜色，其实现原理则是在底层新添加了一个View。此外，TouchableHighlight只能进行一层嵌套，不能多层嵌套。常用属性：activeOpacity number 设置组件在进行触摸的时候，显示的不透明度(取值在0-1之间)onHideU

A类导出，B类导入A类B类

TextInput常用属性value 文本输入的默认值，赋值后UI不能修改keyboardType 键盘类型，enum(‘default’, “ascii-capable”, ‘numbers-and-punctuation’, ‘url’, ‘number-pad’, ‘phone-pad’, ‘name-phone-pad’, ‘email-address’, ‘decimal-p

Text

获取当前屏幕的宽度、高度、分辨率导入信息一般都用require 关键字 格式：var XXXX = require('XXXX');//首先要导入Dimensions包var Diemnsions = require('Dimensions');export default class App5 extends Component}> { render() { ret

Image组件加载方式从当前项目中加载图片资源文件的查找和JS模块相似，会根据填写的图片路径相对于当前的js文件路径进行搜索。React Naive的Packager会根据平台选择相应的文件，例如:my_icon.ios.png和my_icon.android.png两个文件(命名方式android或者ios)，会分别根据android或者ios平台选择相应的文件。Package

在ReactNative的项目目录中，修改UI，主要修改的是下图标注出来的俩个文件 在index.js的文件中import { AppRegistry //注册组件} from 'react-native';import App from './App';//引用APP文件// 注册应用(registerComponent)后才能正确渲染// 注意：只把应用作为一个整体注册一次，而

环境搭建必需的软件安装HomebrewHomebrew, Mac系统的包管理器，用于安装NodeJS和一些其他必需的工具软件。安装方式：/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"可以执行brew -v进行检查brew是否已经安装成功安装n

在React Native中可以通过TabBarIOS和TabBarIOS.Item组件来实现选项卡切换效果，大家可以看到后面带有IOS，所以这个组件是不支持Android的，当然后面我们可以自定义该组件TabBarIOS常见的属性View的所有属性都可以被继承barTintColor： 设置tab条的背景颜色tintColor：设置tab条上被选中图标的颜色translucent ：boo