آموزش جاوااسکریپت › انجمن ها › react native › دوره آموزش react navigation 3
-
نویسندهنوشتهها
-
ابوالفضلمشارکت کننده
باسلام و خسته نباشید
توی دوره آموزش react navigation 3 وقتی میخوام از drawer استفاده کنم این error رو میده:
this.props.navigationProps.toggleDrawer() is not a functionاول از روشی که توی آموزش خودتون گفتین رفتم بعد از روش هایی که توی github و کتابخونه خود react navigation هم زفتم ولی بازم error داد
راه حلی سراغ دارین؟باتشکر
امیر حسین حیاتیمشارکت کنندهدرود بر شما دوست عزیز.
میشه خواهش کنم کدهای مربوط به drawer بزارین تا من تستش کنم ببینم کجا مشکل دارهابوالفضلمشارکت کنندهبله حتما
لطف میکنینimport React, {Component} from ‘react’;
import {createStackNavigator, createAppContainer, createBottomTabNavigator, createDrawerNavigator} from ‘react-navigation’;
import {View, Image, TouchableOpacity} from ‘react-native’;
import DetailScreen from ‘./detail’;
import HomeScreen from ‘./home’;
import SettingScreen from ‘./setting’;
import FirstScreen from ‘./first’;
import SecondScreen from ‘./second’;class NavigationDrawerImage extends Component{
render(){
return(
<View>
<TouchableOpacity
onPress={()=> this.props.navigationProps.toggleDrawer()}>
<Image
source={require(‘../image/menu.png’)}
style={{width:25, height:20, marginLeft:10}}/>
</TouchableOpacity>
</View>
)
}
}const Stack1= createStackNavigator({
Home:{
screen:HomeScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})
}
})
const Stack2 = createStackNavigator({
Detail:{
screen:DetailScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})
}
})
const Stack3 = createStackNavigator({
Setting:{
screen:SettingScreen,
navigationOptions: (navigation)=>({
headerLeft: <NavigationDrawerImage navigationProps={navigation} />
})}
})
const RootStack= createBottomTabNavigator({
tab1:{
screen:FirstScreen
},
Home:{
screen:Stack1
},
tab2:{
screen:SecondScreen
}
})const DrawerNavi = createDrawerNavigator({
screen1:{
screen: Stack1
},
screen2:{
screen: Stack2
},
screen3:{
screen: Stack3
}
},
{
drawerWidth:150
})export default createAppContainer(DrawerNavi);
امیر حسین حیاتیمشارکت کنندهابوالفضل عزیز error که شما بهش برخوردین مربوط به این خط کده که درون stack1 , stack2 , stack3 نوشته شده:
navigationOptions: (navigation)=>({
headerLeft:}) کد درست:
navigationOptions: ({navigation})=>({
headerLeft:}), درواقع شما باید بجای (navigation) کد ({navigation}) قرار بدین
ابوالفضلمشارکت کنندهآخ ببخشید
درست شد.مرسی از راهنماییتون -
نویسندهنوشتهها