React-Native 笔记

安装 node ,homebrew
brew install node
brew install watchman

安装 eact-native-cli
npm install -g yarn react-native-cli

安装第三方库
npm i xxx

创建项目
react-native init AwesomeProject

运行项目
react-native run-ios

指定模拟器
react-native run-ios —simulator ‘iPhone XS Max'

输出 react-native info
react-native info

是否换行 wrap or nowrap
flexWrap :
主轴的对齐方式
justifyContent
侧轴的对齐方式
alignItems : stretch 拉伸

修改子视图的对齐方式,父视图的不起作用
alignSelf
主轴上内容的权重比
flex
绝对布局,之后可以使用left ,top
position:absolute

插件:
安装 react-navigation
npm install --save react-navigation
npm install --save react-native-gesture-handler
react-native link react-native-gesture-handler

安装
npm i react-native-vector-icons —-save
react-native link react-native-vector-icons

报错 Check the render method of TabBarIcon
解决办法 把括号去掉
import {Ionicons} from "react-native-vector-icons/Ionicons”;

//删除 node_modules 并重新运行
rm -rf node_modules && npm install
安卓模拟器刷新
command + m

DeviceEventEmitter 的使用,监听器类似于iOS 的通知 ,部分刷新

DeviceInfo.isIPhoneX_deprecated ? 30 : 0 适配iPhone X

如何自定义一个react-native 组件

安卓物理返回键的处理,

iPhone X 的适配

webview 的使用

JSON.parse() 解析成js 对象
JSON.stringify() json对象转成字符串

react-native-event-bus 事件总线模式,跨页面通信

全面屏的适配问题

你可能感兴趣的:(React-Native 笔记)