用户登录

国庆活动:订阅年付会员送 6 个月,重订、续订送 12 个月。订阅 →

下面我们用 TabBarIOS 组件在应用里添加一个标签栏 .. 打开 index.ios.js .. 先把这个组件从 React 里面提取出来 .. 这里添加一个 TabBarIOS ..

然后在这个文件里定义的组件的 render 方法里 .. 可以去用一个这个组件 .. 去掉里面的东西 .. 添加一组 TabBarIOS .. 保存 .. 在应用的底部,会有一个标签栏 .. 不过现在它里面还没有东西 ..

我们可以使用 TabBarIOS.item 去定义标签项目 .. 添加一组这样的标签 .. 在这个项目上可以再添加一个小图标 .. 我们可以使用自定义的小图标 .. 这里先用一个系统自带的图标 .. 添加一个 systemIcon 属性 .. 它的值设置成 featured ..

在这个标签栏上,你会看到一个项目 .. 在这个标签项目里面,用一个 MovieList 组件 .. 这样打开这个标签的时候,会显示 MovieList 这个组件里的东西 .. 复制一下这个项目 .. 这个标签项目里面,可以使用一个 USBox 组件 .. 图标改成 most-viewed ..

保存 .. 现在标签栏上会显示两个项目 .. 在默认要显示的项目的上面,我们可以添加一个 selected 属性 .. 比如我想让 USBox 这个页面作为默认打开的页面 .. 在这个项目上面,添加一个 selected .. 它的值设置成 true ..

保存 .. 你会看到, Most Viewed 这个标签项目会高亮显示 .. 应用默认会显示北美票房排行榜这个页面 .. 也就是 USBox 这个组件要输出的内容 ..

标签栏里的项目《 React Native #2 导航 》

统计

11228
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点