UNPKG

rn-project

Version:

#### 项目介绍 类似一个脚手架的工具 此项目致力于构建一套基础,简单,可维护的 适配我司的react-native项目。可在此基础上搭建项目,封装了基础架构,基础组件,以及各种交互等;可快速进行项目搭建,开发。 # 涉及主要技术 - 1. 项目主要架构 * react native * react-navigation * redux

99 lines (87 loc) 2.7 kB
import React from 'react'; import { AsyncStorage } from 'react-native'; import { createBottomTabNavigator } from 'react-navigation'; import { Image } from 'react-native'; import BaseStyle from './constants/Style'; import HomeScreen from './pages/home'; import MineScreen from './pages/mine'; const getIcon = type => { switch (type) { case 'Home': return require('./images/home/home.png'); case 'Home-focused': return require('./images/home/home_1.png'); case 'Mine': return require('./images/home/mine.png'); case 'Mine-focused': return require('./images/home/mine_1.png'); } }; export default createBottomTabNavigator( { Home: { screen: HomeScreen, navigationOptions: () => ({ title: '首页', }), }, Mine: { screen: MineScreen, navigationOptions: () => ({ title: '我的', tabBarOnPress: async obj => { const { navigation, defaultHandler } = obj; //在这里控制登录跳转 const userData = await AsyncStorage.multiGet(['token', 'userId']); if (userData[0][1] && userData[1][1]) { //登录状态下 defaultHandler(); } else { global.token = ''; global.userId = ''; navigation.navigate('LoginScreen'); } }, }), }, }, { initialRouteName: 'Home', /* eslint-disable */ // 这里暂时不做代码风格校验 后面按需剥离出来 navigationOptions: ({ navigation }) => ({ tabBarIcon: ({ tintColor, focused }) => { const { routeName } = navigation.state; let iconName if (routeName === 'Home') { iconName = focused ? getIcon(`${routeName}-focused`) : getIcon(routeName); } else if (routeName === 'Mine') { iconName = focused ? getIcon(`${routeName}-focused`) : getIcon(routeName); } return ( <Image source={iconName} style={{ width: 20, height: 20 }} /> ); }, }), /* eslint-disable */ tabBarOptions: { activeTintColor: BaseStyle.primaryColor.color, // 文字和图片选中颜色 // inactiveTintColor: '#999999', // 文字和图片未选中颜色 // showIcon: true, // android 默认不显示 icon, 需要设置为 true 才会显示 // indicatorStyle: { // height: 0 // 如TabBar下面显示有一条线,可以设高度为0后隐藏 // }, style: { //整个tab样式设置 backgroundColor: '#fff', borderTopWidth: 0, height: 49 }, labelStyle: { fontSize: 14, }, }, }, );