我的底部导航栏作用不上，老师，帮我看一下什么原因,查看了。。也没有报错

来源：1-5 项目底部导航菜单开发

慕粉1471353066

2017-07-26

<TabNavigator.Item

selected={this.state.selectedTab === 'tb_popular'}

selectedTitleStyle={{color: 'red'}}

title="最热"

renderIcon={() => <Image style={styles.image} source={require('./res/images/ic_polular.png')} />}

renderSelectedIcon={() => <Image style={[styles.image],{tintColor: 'red'}} source={require('./res/images/ic_polular.png')} />}

badgeText="1"

onPress={() => this.setState({ selectedTab: 'tb_popular' })}>

</TabNavigator.Item>

<TabNavigator.Item

selected={this.state.selectedTab === 'profile'}

selectedTitleStyle={{color: 'yellow'}}

title="Profile"

renderIcon={() => <Image style={styles.image} source={require('./res/images/ic_favorite.png')} />}

renderSelectedIcon={() => <Image style={[styles.image],{tintColor: 'yellow'}} source={require('./res/images/ic_favorite.png')} />}

onPress={() => this.setState({ selectedTab: 'profile' })}>

</TabNavigator.Item>

</View>

写回答

1回答

CrazyCodeBoy

2017-08-01

已采纳

从代码上看，你少了一步：

<TabNavigator.Item>需要配合<TabNavigator></TabNavigator>一起使用：

将代码改成:

<View style={styles.container}>
    <TabNavigator>
        <TabNavigator.Item
            selected={this.state.selectedTab === 'tb_popular'}
            selectedTitleStyle={{color: 'red'}}
            title="最热"
            renderIcon={() => <Image style={styles.image} source={require('./res/images/ic_polular.png')} />}
            renderSelectedIcon={() => <Image style={[styles.image],{tintColor: 'red'}} source={require('./res/images/ic_polular.png')} />}
            badgeText="1"
            onPress={() => this.setState({ selectedTab: 'tb_popular' })}>
            <View style={styles.page1}><Text>1111</Text></View>
        </TabNavigator.Item>
        <TabNavigator.Item
            selected={this.state.selectedTab === 'profile'}
            selectedTitleStyle={{color: 'yellow'}}
            title="Profile"
            renderIcon={() => <Image style={styles.image} source={require('./res/images/ic_favorite.png')} />}
            renderSelectedIcon={() => <Image style={[styles.image],{tintColor: 'yellow'}} source={require('./res/images/ic_favorite.png')} />}
            onPress={() => this.setState({ selectedTab: 'profile' })}>
            <View style={styles.page2}><Text>22222</Text></View>
        </TabNavigator.Item>
    </TabNavigator>
</View>

即可。

慕粉1471353066

非常感谢！

2017-08-04

共1条回复

React Native技术精讲与高质量上线App开发

一个真实的上线项目，一次完整的开发过程，全面掌握React Native技术

1577 学习 · 727 问题

查看课程

相似问题

andriod下运行正常，导入mac下运行报错：并且真机还未启动就报错了

回答 2