这是我参与8月更文挑战的第29天，活动详情查看：更文挑战
配置环境变量
有时候我们要执行一些执行，但是指令文件只是在特定的目录中，如果这些目录在环境变量中配置了，这些目录中的指令文件就可以在系统的任何位置访问了，这样我们就可以直接使用这些指令
打开环境变量配置
计算机 => 属性 => 高级系统设置
环境变量操作
新增：是创建一个新的环境变量
编辑：修改原来的环境变量
换将变量有两类
系统环境变量：可以在任何用户中使用
用户环境变量：只能在该用户中是用。
java环境变量
创建JAVA_HOME环境变量
变量名：JAVA_HOME
变量值：java安装的目录：C:\Program Files (x86)\Java\jdk1.8.0_144
修改path环境变量
添加bin目录
第一种 C:\Program Files (x86)\Java\jdk1.8.0_144\bin
第二种 %JAVA_HOME%\bin
添加jre\bin目录
第一种 C:\Program Files (x86)\Java\jdk1.8.0_144\jre\bin
第二种 %JAVA_HOME%\jre\bin
注意：修改前，一定要先将原来的path复制出来，再修改
android环境变量
创建ANDROID_HOME环境变量
变量名：ANDROID_HOME
变量值：
如果是第二种安装方式C:\Program Files (x86)\Android\android-sdk
如果是第三种安装方式,就是解压的目录 d:\android-sdk
修改path环境变量
添加tools目录
第一种 C:\Program Files (x86)\Android\android-sdk\tools
第二种 %ANDROID_HOME%\tools
添加platform-tools目录
第一种 C:\Program Files (x86)\Android\android-sdk\platform-tools
第二种 %ANDROID_HOME%\platform-tools
注意：修改前，一定要先将原来的path复制出来，再修改
测试
测试前，一定要重启CMD
测试javas
javac -version
测试 android
android 打开Android adk管理工具
adb devices 查看链接手机设备
运行项目
首先用use数据线链接手机和电脑
手机开启开发者模式
安装虚拟机
安装virtual box
提供了一个虚拟机运行环境
点击安装程序，进行下一步安装
安装genymotion
点击安装程序，进行下一步安装
我们首先打开virtual box，再genymotion。
注册账号
进入 网站，注册账号
登录
下载设备
点击添加设备按钮，选择一个设备
下载设备的时候，是向C:\Users\think\AppData\Local\Genymobile\Genymotion\ova目录下，下载设备的
我们可以将给大家发的ova文件放在目录中，
我们也可以进入virtual box软件，点击 管理 => 导入虚拟电脑 => 选择ova文件，点击下一步，开始导入设备
配置sdk
进入设置页面，点击adb，选择Android sdk安装目录
启动项目
输入adb devices查看是否有链接的设备
能够找到手机的设备，我们就可以输入react-native run-android来启动项目了
此时我们就可以在虚拟设备中看到欢迎页面了
react-native run-android
虚拟机调试
reload 表示重新加载页面
disabled|enabled hot reloading 是否关闭或者打开热加载
调试视图结构
我们可以安装devtools来调试页面视图结构
npm install -g react-devtools
此时提供了react-devtools，我们可以打开调试界面
模拟了chrome的调试器，但是不能输出信息
打印日志
我们常常在调试中，输入一些信息，react-native内置了log指令，可以帮我们查看数据信息
android： react-native log-android
ios: react-native log-ios
注意：在项目的目录下运行
react-native log-android
组件开发
RN的核心是react，因此定义虚拟DOM和组件的语法都是一样的
例如定义虚拟DOM :
注意：native不是浏览器环境，因此没有web端的DOM元素，但是RN通过一些组件可以模拟这些DOM元素，例如
View 模拟 div
Text 模拟 span
这些组件都是RN提供的，因此使用这些组件要通过RN引入
定义组件的语法跟web端定义组件的语法是一样的。
web端 class 组件 extends Component {}
native端 class 组件 extends Component<{}> {}
<{}>这是ts语法中的泛类型。
其他的都一样
RN也是用ES Module规范开发项目
数据双向绑定
在web端，我们用input定义输入框
在RN中，我们用TextInput组件定义输入框
它们是很相似的，如都可以通过placeholder定义提示的文案
在input元素中，通过onChange事件监听内容的变化，参数是事件对象
在TextInput组件中，通过onChangeText事件监听内容的变化，参数是内容。
