react-native - 如何在 react-native-router-flux 中删除 TabIcon 下的文本
问题描述
我无法删除 react-native-router-flux 的 TabBar 中 TabIcon 下的文本。这是我的 TabBar 的屏幕: 在此处输入图像描述
这是我的路由器代码:
const TabBar = ({focused}) => (
<View>
<Icon name="search" type="MaterialIcons" style={{fontSize: 28, color: focused ? 'red': 'white'}} />
</View>
)
export default () => (
<Router>
<Scene hideNavBar>
<Scene key="tabbar" tabs tabBarStyle={{backgroundColor: '#000'}}>
<Scene key="list" title="Ahlo" component={List} hideNavBar icon={TabBar} />
<Scene key="search" component={search} hideNavBar icon={TabBar} />
<Scene key="account" component={account} hideNavBar icon={TabBar} />
</Scene>
<Scene key="article" component={article} />
<Scene key="comment" component={comment} />
<Scene key="register" component={register} />
<Scene key="auth" component={auth} />
</Scene>
</Router>
)
在每个教程中,我都看到 TabIcon 下的文本丢失了,但我有。我在这里做错了什么?
解决方案
您可以尝试通过将showLabel
道具添加到父级或特定子级Scene
到false
,(默认情况下,其值为true
)
所以你的标签栏场景代码将是:
<Scene key="tabbar" showLabel={false} tabs tabBarStyle={{backgroundColor: "#000"}}>
<Scene key="list" component={List} showLabel={false} hideNavBar icon={TabBar} />
<Scene key="search" component={search} showLabel={false} hideNavBar icon={TabBar} />
<Scene key="account" component={account} showLabel={false} hideNavBar icon={TabBar} />
</Scene>
希望这会有所帮助。
推荐阅读
- cloud - ICP4D(IBM Cloud Pak for Data)也可以用作数据质量工具吗?
- javascript - 是否可以从 javascript 中的“构造函数”调用类方法?
- xml - 如何在属性之后读取 XML 值
- javascript - 量角器测试中的条件:如果元素包含特定文本则执行操作
- swift - alamofire 中的时间间隔来观察 API 的变化
- excel - 如果另一列数据相等,则对列中的值求和
- python - Beautifulsoup 分页使用下一个按钮
- json - 从文件读取配置时,Invoke-Command 失败并显示 $env 变量失败
- wordpress - 如何最好地实例化多个克隆站点并维护它们?
- ruby - 有条件地重启服务