如何使用“ tabBarOnPress”加载自己的函数?

时间:2018-12-24 17:02:57

标签: react-native react-navigation

每次尝试选择特定选项卡时,我都试图加载imagePicker()函数。目前,我正在尝试劫持onTabFocus,但无法正常工作。我还有其他方法可以实现这一目标吗?

    export class AddImage extends Component{

    imagePicker(){
            //definition of function.......
    }

    static navigationOptions = ({navigation}) => {
     return {
         tabBarOnPress({jumpToIndex, scene}) {
              navigation.state.params.onTabFocus();
         }
     }
    }
     componentDidMount(){
        this.props.navigation.setParams({onTabFocus: this.imagePicker.bind(this)})
    }
   }

   export default createBottomTabNavigator({
         Home: { screen: Home, 
          navigationOptions:{
              tabBarLabel: 'Home',
              tabBarIcon: ({tintColor})=>(<Icon name="home" color={tintColor} size={24}/>)
          }
        },
    AddImage: { screen: AddImage
      navigationOptions:{
       tabBarLabel: '',
       tabBarIcon: ({tintColor})=>(<Icon name="plus-square" color={tintColor} size={24}/>),
       tabBarOnPress: ({navigation})=> {navigaition.state.params.onTabFocus() },
       }
     },
        Settings: { screen: Settings,
          navigationOptions:{
            tabBarLabel: 'Settings',
            tabBarIcon: ({tintColor})=>(<Icon name="cog" color={tintColor} size={24}/>)
          }  
         },
    },

    {//other bottom tab configurations
      order: ['Home', 'AddImage', 'Settings'],
      }
    });

1 个答案:

答案 0 :(得分:1)

如果您只需要onTabFocus事件。您可以使用NavigationEvents

这是工作小吃。您可以检查Tab2.js和console.log

https://snack.expo.io/@nazrdogan/moody-donuts