reactnative实战系列教程之完成首页选读.doc

react native 实战系列教程之完成首页 首页功能 前面，我们已经完成了影视信息组件的开发，接下来，我们要用该组件来完成首页界面功能的开发，如下图 可以看到，首页顶部一个标题栏，下面是‘最新’、‘最热’两个选项卡。我们要完成的有标题栏、选项卡、以及选项卡切换的内容。 标题栏 这里的标题栏，我们使用的是ToolbarAndroid，看名称我们就知道这个是Android下特有的组件view，所以就立马想到，这个组件是iOS、android不能通用的。因此，我们定义一个TitleBarComponent，方便以后重复使用和ios适配。这里，先提一下关于组件适配的一些问题。 组件平台适配 不同平台使用不同的组件，React Native 提供了以下四种解决方案 最直接的方案就是把组件放置到不同的文件夹下： /common/components/ /android/components/ /ios/components/ 根据平台不同在组件的文件命名上加以区分，如下： BigButtonIOS.js BigButtonAndroid.js 使用扩展名 BigButton.ios.js BigButton.android.js 以上三种方案，再引用的时候去掉平台标识，如下 import BigButton from ./components/BigButton; Platf