React-Native react-navigation實(shí)現(xiàn)iOS與Android的TabBar

主要文件Root入口，主要代碼Root代碼
第一步


14687A6C-A5EC-41BF-AFF5-2E4A14432B9A.png

第二步配置路由做映射


4E2151C9-6A1D-4065-8290-DED5A95C17C5.png

第三步配置tabBar的樣式看截圖


8A3EE85F-E6F6-4716-8294-91CDA255FC43.png

最后一步追加導(dǎo)航做跳轉(zhuǎn)，設(shè)置默認(rèn)頁面


1C8BC62D-9369-4800-83D5-C263280EF8A4.png

另外
import FirstVC from './FirstVC';
import SecondVC from './SecondVC';
import ThirdVC from './ThirdVC';
import FourVC from './FourVC'
寫成普通的頁面文件就可以，類似于這樣


AA5D8DC1-D143-4EBC-92BD-CB2D3D4A1228.png

然后讓我們看一下效果圖iOS與安卓如下


QQ20180404-144146-HD.gif
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容