1. 程式人生 > >react-native 學習(二)

react-native 學習(二)

androi bsp ger net devel 瀏覽器 sim 百度 解決方法

上一節講到了 react-native的開發環境的配置,,這一節我門具體講講怎麽看樣式,怎麽調試

看樣式的話 有一個 神奇 react-native-developer tools(個人推薦,可選擇性的選擇用還是不用)

本包子 喜歡用真機調試,,,我一般拿android機器調試,,因為react-native在樣式方面 是IOS的親媽,是android的後媽。沒毛病~

1.調試的話,如果是simulator模擬器的話,一般是command + D 彈出菜單選項,裏面有一個 inscpect 這個是檢查樣式的。

如果是真機的話,你就使勁晃動你的手機。就會出來菜單選項了

2.有一個 remote debugger 這個將會自動打開 本地電腦的 谷歌瀏覽器。這個 不能看樣式,但是能看到 發送請求的log日誌 在console 控制臺

你也可以去打斷點。這一整個項目做下來,我發現沒有什麽bug是打斷點解決不了的。。。。。

但是 有時候,我們想去看看我們發送的請求可咋整,因為network裏面沒有請求的日誌,比較,react-native 不是H5.。。。。

這個時候我們可以用抓包工具,charlse 茶壺,這個響當當的抓包工具。這個 抓包工具的用法請自行百度

3.如果你在的電腦上更改了什麽東西,想要 實時更新在你的手機上。。 你會發現 有一個hot reloading 沒錯 ,點擊他。。然後,將你,當前電腦連接的ip 輸入進去。

端口默認是8081.。前提是你npm start 的時候沒有更改過端口號

然後 重新 在 reload 你的頁面。。。一般一切順利的話,,,當你 在 頁面上 改什麽東西的話,,就會在你的手機上顯示 hot reloading

BUT 大部分的時候不會這麽順利。。。可能出現 報錯。。。一般其實 我們就照著 報錯上面的提醒做就行(這一點蠻好的,報錯的解決方法和原因都給你寫裏面了)

一般我的報錯 解決方法就是 adb reverse tcp:8081 tcp:8081 這個命令行。。然後 仔重新 運行一下環境就好了。記住啊,這個必須是 手機和 電腦在同一個局域網下/

總而言之,這個 調試方法就是 command +D 或者 搖一搖。。。。

下一節我們講講react-native中的樣式寫法和兼容問題

react-native 學習(二)