路由器流量-如何在标签栏上禁用自动文本？

Question

这是结果。我想自己渲染文本和图标。因此，我需要为选项卡禁用自动生成的文本。有什么建议吗？

此外，文本颜色在激活时（TabIcon功能）不会变为红色。

import React from 'react'
import {Text} from 'react-native'
import {Router, Scene,Stack, Modal} from 'react-native-router-flux'

// Scenes
import BrowseUser from '../scenes/BrowseUser'
import Notifications from '../scenes/Notifications'
import Search from '../scenes/Search'
import Timeline from '../scenes/Timeline'

const TabIcon = ({selected,title}) => {
  return(<Text style={{color: selected ? 'red ' : 'black'}}>{title} 
</Text>)
}

export default props => (
<Router>
    <Stack key="root" hideNavBar>
        <Scene key='main' icon={TabIcon} tabs={true} initial tabBarStyle={{backgroundColor: '#00FF00'}}>
            <Scene key='timeline' component={Timeline} title='Timeline'/>
            <Scene key='browseUser' component={BrowseUser} title='BrowseUser'/>
            <Scene key='search' component={Search} title='Search'/>
            <Scene key='notifications' component={Notifications} title='Notifications'/>
        </Scene>
    </Stack>
</Router>
)

Answer 1

关于

  

所以我需要禁用选项卡的自动生成的文本。有什么建议吗？

componnet支持道具showLabel，因此您可以将其设置为false showLabel={false}，并且不会显示选项卡式场景的标题。

关于

  

此外，文本颜色在激活时（TabIcon功能）不会变为红色。

在选择时传递的道具是focused而不是“已选择”。所以应该是

const TabIcon = ({ focused,title }) => 
  (<Text style={{color: focused ? 'red ' : 'black'}}>{title}</Text>)