Admob React Native google mobile ads How can I add InterstitialAd when user go back from a particular page or exit a page
React native has its own default back button.
How can I add InterstitialAd in React Native, when I press React native back button from a page or if I exit the page(Not exiting the App) by pressing the Home button in Bottom Tabs Navigator bar.
I have added my Home button in Tabbar. so that a user directly clicks Home button from a particular page.
This is the page where I have added InterstitialAd
import React, { useState, useEffect } from "react"; import { View, Button, Text, ScrollView, } from 'react-native'; import { AppOpenAd, InterstitialAd, RewardedAd, BannerAd, TestIds, AdEventType } from 'react-native-google-mobile-ads'; const TestAds = ({ navigation }) => { useEffect(() => { let interstitial = InterstitialAd.createForAdRequest(TestIds.INTERSTITIAL, { requestNonPersonalizedAdsOnly: true, keywords: ['fashion', 'clothing'], }); interstitial.addAdEventListener(AdEventType.LOADED, () => { interstitial.show(); }); interstitial.load(); return () => { interstitialListener = null; }; }, []); return ( <ScrollView> <View> <View style={{ marginTop: 20 }}> <Text> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, </Text> </View> </View> </ScrollView> ) } export default TestAds My App.js file
import * as React from 'react'; import { NavigationContainer } from '@react-navigation/native'; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import { createNativeStackNavigator } from '@react-navigation/native-stack'; import Contact from './Contact'; import Test from './Test'; import TestAds from './TestAds'; const Tab = createBottomTabNavigator(); const HomeTabs = ({ navigation }) =>{ return ( <Tab.Navigator screenOptions={{ headerShown: false }}> <Tab.Screen name="Contact" component={Contact} /> <Tab.Screen name="Test" component={Test} /> </Tab.Navigator> ); } const Stack = createNativeStackNavigator(); export default function App () { return ( <NavigationContainer> <Stack.Navigator> <Stack.Screen name="Home" component={HomeTabs} /> <Tab.Screen name="TestAds" component={TestAds} /> </Stack.Navigator> </NavigationContainer> ); }