React Native当用户关闭页面或返回上一页时，我如何在Admob谷歌移动广告中显示InterinitialAds

Question

当用户关闭当前访问的页面时，我如何实现InterinitialAd广告。

用户还可以使用他的移动设备后退按钮(而不是本地后退标题按钮(从页面返回(关闭页面(。

请检查以下代码

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 Test = ({ 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 Test

我的App.js文件

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 Test from './Test';
import TestTwo from './TestTwo';
const Tab = createBottomTabNavigator();
const HomeTabs = ({ navigation }) =>{
return (
<Tab.Navigator screenOptions={{ headerShown: false }}>
<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="TestTwo" component={TestTwo} />
</Stack.Navigator>
</NavigationContainer>
);
}

Answer 1

我已经在许多应用程序中做到了这一点，所以理解并运行以下代码。

const {showAd, adDismissed, adPresentError, connected,
setAdShowingInterstitial} = useContext(AppContext);
const [voicePressed, setVoicePressed] = useState(false);
useEffect(()=>{
if(adDismissed || adPresentError || !connected){
setAdShowingInterstitial(false);
navigation.navigate('backscreen')// 
}
},[adDismissed,adPresentError,connected]);
//  you have to call adShow function in backbtnPress like below
function handleBackButtonClick() {
showAd();
setInterstitial("backscreen")
return true;
}
useEffect(() => {
BackHandler.addEventListener("hardwareBackPress", 
handleBackButtonClick);
return () => {
BackHandler.removeEventListener("hardwareBackPress", 
handleBackButtonClick);
};
}, []);