React Native之從「UI元素直接定位代碼」
很多時候我們開發(fā)時想根據(jù)UI元素痹栖，直接知道對應(yīng)的代碼在哪個文件的哪個位置错沽，react native開發(fā)的程序員是有這個福利的收擦，下面我們具體來看看：
辦法一（什么額外的軟件都不安裝）
- 打開檢查元素(不需要debug in chrome)哆键；
- 點擊某個按鈕苞轿，如下圖所示：
youdao1.jpg
辦法二（借助react-devtools）
官方文檔：https://facebook.github.io/react-native/docs/debugging.html#chrome-developer-tools
安裝
npm install -g react-devtools- 如果安裝過程中發(fā)現(xiàn)比較慢嗜傅，看看是不是下面這個原因：
Downloading electron-v1.8.8-darwin-x64.zip
[=> ] 6.4% of 48.34 MB (1.98 kB/s)
- 如果是這個原因谨娜，結(jié)束安裝吧，自己去下載electron-v1.8.8-darwin-x64.zip磺陡，然后放到 /Users/test/.electron 這個目錄（test是用戶名）趴梢，然后直接把 /usr/local/lib/node_modules/react-devtools/node_modules/electron 這個目錄刪掉，重新執(zhí)行
npm install -g react-devtools命令即可很快安裝完成币他；
使用
- 命令行執(zhí)行
react-devtools命令坞靶； - 打開模擬器，在debug in chrome模式下進去一個rn項目蝴悉；
- 打開檢查元素開關(guān)即可(不需要debug in chrome)彰阴；
- 試試點擊頁面元素，有沒有很驚奇拍冠？
- 祝你好運尿这，如下圖所示：
youdao2.jpg
