按照傳統(tǒng),搭建完環(huán)境之后就可以寫第一個demo了胁编,俗稱helloWorld。
一、環(huán)境搭建的地址:
http://reactnative.cn/docs/0.47/getting-started.html#content
這個地址是官方的构罗,真的很詳細,照著做就對了智玻。
二遂唧、運行
打開終端,cd到你想要放置demo的位置吊奢,然后運行如下命令:
react-native init HelloWorld --version 0.44.3
cd HelloWorld
react-native run-ios
這里解釋下盖彭,為什么要加版本號。官方給出的說法是:
注意:init命令默認會創(chuàng)建最新的版本页滚,而目前最新的0.45及以上版本需要下載boost庫編譯召边。此庫體積龐大,在國內(nèi)即便翻墻也很難下載成功裹驰,導致很多人無法正常運行iOS項目隧熙,中文網(wǎng)在論壇中提供了這些庫的國內(nèi)下載鏈接。如果你嫌麻煩邦马,又沒有對新版本的需求贱鼻,那么可以暫時創(chuàng)建0.44.3的版本。
提示:如果run-ios無法正常運行滋将,請使用Xcode運行來查看具體錯誤(run-ios的報錯沒有任何具體信息)邻悬。
注意:這里是默認使用模擬器運行項目的,運行效果如下:
但是随闽,使用RN調(diào)試的時候需要搖動手機父丰,這個時候使用模擬器不是很方便,用真機比較好。如何在真機上運行呢蛾扇?
真機運行鏈接:
http://reactnative.cn/docs/0.47/running-on-device-ios.html#content
真機運行成功之后攘烛,搖一搖手機,界面如下:
這個時候镀首,xcode不要停掉坟漱,不要停掉,打開項目中的index.ios.js這個文件更哄,改改文字還是可以的芋齿。
這個文件隨便截兩張圖看看
我們雖然并不能完全看得懂每行代碼的意思,但是改改文字和樣式還是可以的啊成翩。
顯示效果如下:
改改樣式:
顯示如下:
OK觅捆,我們的第一個簡易的holloworld就算完成啦。