这是我参与「第五届青训营 」笔记创作活动的第11天
跨端开发
react-native
react-native是一个使用React和应用功能来构建Android和ios应用的开源框架。通过React Native，可以使用，您可以使用JavaScript来访问移动平台的API，以及使用React组件来描述UI的外观和行为。
安装
安装依赖：node、jdk、android
node版本需要大于等于14，并且设置淘宝镜像源
可以使用nrm切换
npx nrm use taobao
jdk版本需要jdk11
创建项目
注意事项
- 路径中不能含有中文、特殊符号
- 项目文件夹名字不能与模块同名
npx react-native init 项目名
组件
React Native允许用户为Android和Ios构建原生组件。
核心组件
- view
- text
- image
- scrollview
- textinput
特定平台代码
对于跨平台的应用，需要针对不同的平台不同代码
react native 提供了一个Platform模块，可以检测运行平台。
import { Platform, StyleSheet } from 'react-native';
const styles = StyleSheet.create({
height: Platform.OS === 'ios' ? 200 : 100
});
Platform会在ios上返回ios，在Android上返回android
在特定平台代码逻辑过于复杂时，可以放到不同的文件中
.android.js
.ios.js
开发
css以js规范来驼峰命名。
react native中尺寸都是用无单位表示。
使用flexbox规则来指定某个组件的子元素的布局，以便为不同的屏幕提供一致的布局结构。
一般来说，使用flexDirection、alignItems、justifyContent三种样式。
react native上默认值不同flexDirection默认值为columnb而不是row，alignContent默认值为flex-start而不是stretch，flexshrink默认值为0而不是1，而flex只能指定一个数字值。
react native提供了统一的方式管理ios和android的图片资源，在app中引用只需要把它放在文件夹某处，然后在标签里引用
<Image source={require('文件')}/>
触摸事件 onpress
导航
使用导航库 react-navigation来导航页面
