ios - react-navigation 正在 iOS 模拟器上工作,但在 iOS 真实设备上面临导航问题
问题描述
react - 导航适用于 iOS 和 android 模拟器以及 android 真实设备,但不适用于 iOS 真实设备
我正在使用堆栈导航器,在堆栈导航器内使用抽屉导航器和选项卡导航器,但在运行项目时,它正在 iOS 和 android 模拟器和 android 真实设备上工作,但在 iOS 真实设备上不工作
我正在使用“反应导航”:“^3.9.1”
const AppContainer = createAppContainer(AppSwitchNavigator)
const AppSwitchNavigator = createStackNavigator({ // here i am create stack navigator and inside stack navigator used drawer navigator for dashboard
welcome: {
screen: WelcomeScreen,
},
dashboard: {
screen: AppDrawerNavigator1, // here i am using drawer navigator with some navigation options
navigationOptions: ({ navigation }) => {
return {
headerStyle: {
backgroundColor: '#26c281'
},
headerLeft: (
<Icon name="ios-menu" size={30} style={{
paddingLeft: 10
}} onPress={() => navigation.openDrawer()} />
),
}
}
},
searchproduct: {
screen: SearchProduct
},
postanitem: {
screen: PostAnItem
},
livechat: {
screen: LiveChat
},
marketprice: {
screen: MarketPrice
},
knowledgeresource: {
screen: KnowledgeResource
},
registration: {
screen: UserRegistration
},
postAnItemSubmit: {
screen: PostAnItemSubmit
},
langset: {
screen: LanguageSetting
},
ProductDisplay: {
screen: ProductDisplay,
},
},
{
defaultNavigationOptions: {
headerStyle: {
backgroundColor: '#26c281'
}
}
}
const AppDrawerNavigator1 = createDrawerNavigator({
drawerHome: {
screen: dashboardStackNavigator,
navigationOptions: {
title: 'Home',
drawerIcon: ({ tintColor }) => (<Icon name='ios-home' size={30}
style={{ color: tintColor }} />)
}
},
drawerDashboard: {
screen: Dashboard,
navigationOptions: {
title: 'Dashboard',
headerStyle: null,
drawerIcon: ({ tintColor }) => (<Icon name='ios-keypad' size={30}
style={{ color: tintColor }} />)
}
},
drawerSearchproduct: {
screen: SearchProduct,
navigationOptions: {
title: 'Search Products',
drawerIcon: ({ tintColor }) => (<Icon name='ios-search' size={30}
style={{ color: tintColor }} />)
}
},
drawerPostAnItem: {
screen: PostAnItem,
navigationOptions: {
title: 'post an item',
drawerIcon: ({ tintColor }) => (<Icon name='ios-add-circle' size=
{30} style={{ color: tintColor }} />)
}
},
drawerMarketPrice: {
screen: MarketPrice,
navigationOptions: {
title: 'Market Price',
drawerIcon: ({ tintColor }) => (<Icon name='ios-stats' size={30}
style={{ color: tintColor }} />)
}
},
drawerKnowledgeResource: {
screen: KnowledgeResource,
navigationOptions: {
title: 'Knowledge Resources',
drawerIcon: ({ tintColor }) => (<Icon name='ios-book' size={30}
style={{ color: tintColor }} />)
}
},
myproducts: {
screen: MyProducts,
navigationOptions: {
title: 'My Products',
drawerIcon: ({ tintColor }) => (<Icon name='ios-basket' size={30}
style={{ color: tintColor }} />)
}
},
languagesetting: {
screen: LanguageSetting,
navigationOptions: {
title: 'Language Setting',
drawerIcon: ({ tintColor }) => (<Icon name='ios-globe' size={30}
style={{ color: tintColor }} />)
}
},
drawerlogin: {
screen: Login,
navigationOptions: {
title: 'Login',
drawerIcon: ({ tintColor }) => (<Icon name='ios-log-in' size={30}
style={{ color: tintColor }} />)
}
},
drawerRegistration: {
screen: UserRegistration,
navigationOptions: {
drawerLabel: () => null,
}
},
})
const dashboardStackNavigator = createStackNavigator({
dashboardTabNavigator: dashboardTabNavigator
},
{
defaultNavigationOptions: ({ navigation }) => {
return {
header: null
}
}
})
const dashboardTabNavigator = createMaterialTopTabNavigator({ //using tab navigator inside drawer navigator
itemsell: {
screen: ItemListSell,
navigationOptions: {
title: 'item list sell'
}
},
itembuy: {
screen: ItemListBuy,
navigationOptions: {
title: 'item list buy'
}
}
},
{
tabBarOptions: {
style: {
backgroundColor: '#26c281'
}
}
})
解决方案
推荐阅读
- angular - Angular - 下拉列表优化
- solr - 如何在 SolrCloud 模式下正确更新配置集
- javascript - 使用 bootstrap V5 进行自定义验证
- python - 带有 pyqt6 的 pyinstaller 无法使用 pyqt5 模块构建没有属性 __version__
- angular12 - 使用 Angular 12 中的 TreeMap Google Charts 更改每个孩子的颜色并计算孩子的值
- android - 如何在 android 中的条码扫描器中实现 flash 切换
- flutter - 颤振图像选择器自定义画廊设计
- android - MPAndroidChart 限制行文本被截断
- python - 移除隐藏设备
- mongodb - 如何确保使用 Mongoose 只调用一次函数