react-native調試方法


第一種:https://reactnative.cn/docs/debugging/

第二種:安裝(推薦使用,我就是用這個)

   第一步:官網地址:https://github.com/jhen0409/react-native-debugger/releases

   第二步:找到適合你的點擊下載

 

 

 

 第三步:把下載的解壓出來,然后運行下面的

 

 

運行效果如下:

 

 

 

 


如何使用呢? 相當的簡單, 參考文檔:

https://github.com/jhen0409/react-native-debugger/blob/master/docs/getting-started.md

鑒於是英文文檔,有些小伙伴可能也沒耐心看,簡單介紹一下操作步驟。

1.關閉Chrome瀏覽器中所有的 http://localhost:/debugger-ui 頁面;

2.打開下載好的react-native-debugger應用;

3.在模擬器或者真機上打開開發者菜單, 啟用  Debug JS Remotely。

注意:那么如何打開模擬器的開發者菜單呢?

訪問 App 內的開發菜單

1. 首先打開模擬器,鼠標移入模擬器屏幕內,然后你可以通過搖晃設備或是選擇 iOS 模擬器的"Hardware"菜單中的"Shake Gesture"選項來打開開發菜單。另外,如果是在 iOS 模擬器中運行,還可以按下Command + D 快捷鍵 也就是(鍵盤的Ctrl鍵 + D鍵), Android 模擬器對應的則是Command + M 也就是(鍵盤的Ctrl鍵 + M鍵)

 

 

 

 

2. 然后會出現,點擊debug

 

 

 

搞定,可以好好的調試了。

 

 

 

 

還有props值,state值的,用的那個組件。emmmm。。。剛下載用的還不熟,后面再看吧。官網提示可以監控redux,mobx,還沒有嘗試,嘗試之后再來分享吧。

提示:
Enable Hot Reloading和Enable Live Reload一直開啟。
熱加載Hot Reloading與實時加載Live Reload的區別:

(1)實時加載應用更新時需要刷新當前頁面,可以看到明顯的全局刷新效果。

(2)而熱加載基本上看不出刷新的效果,類似於局部刷新。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM