React Native之从「UI元素直接定位代码」
很多时候我们开发时想根据UI元素，直接知道对应的代码在哪个文件的哪个位置，react native开发的程序员是有这个福利的，下面我们具体来看看：
办法一（什么额外的软件都不安装）
- 打开检查元素(不需要debug in chrome)；
- 点击某个按钮，如下图所示：
youdao1.jpg
办法二（借助react-devtools）
官方文档：https://facebook.github.io/react-native/docs/debugging.html#chrome-developer-tools
安装
npm install -g react-devtools- 如果安装过程中发现比较慢，看看是不是下面这个原因：
Downloading electron-v1.8.8-darwin-x64.zip
[=> ] 6.4% of 48.34 MB (1.98 kB/s)
- 如果是这个原因，结束安装吧，自己去下载electron-v1.8.8-darwin-x64.zip，然后放到 /Users/test/.electron 这个目录（test是用户名），然后直接把 /usr/local/lib/node_modules/react-devtools/node_modules/electron 这个目录删掉，重新执行
npm install -g react-devtools命令即可很快安装完成；
使用
- 命令行执行
react-devtools命令； - 打开模拟器，在debug in chrome模式下进去一个rn项目；
- 打开检查元素开关即可(不需要debug in chrome)；
- 试试点击页面元素，有没有很惊奇？
- 祝你好运，如下图所示：
youdao2.jpg
