React Navigation - How To Calling Function From Another File And Use It On Headerright Onpress?

I wonder there's a way to using headerRight onPress to doing something like calling Alert: I have a function inside MyPet.js with the code : _alert=()=>{ alert('saving') } an

Solution 1:

Since your Navigation component has no reference to what is in your Pet.js component, you may try the following way

Use navigationOptions in your Pet.js component as

// Inside the class// Since navigationOptions have no access to this parameter of the class, therefore you need to pass them as paramsstatic navigationOptions = ({navigation}) => {
        const {params}} = navigation.state;
        return {
            headerRight: <FontAwesomename='search'size={20}color="#FFF"onPress={() => params.showAlert()}/> />

        };
    };


 componentDidMount() {
        this.props.navigation.setParams({
            showAlert: this.alertShower
        });
    }

alertShower = () =>Alert.alert('Success', 'Hello')