Question

我在我的React Native应用程序中使用Firebase AdMob，当用户点击特殊按钮时，应该显示一个奖励广告单元。此按钮组件和调用广告横幅的功能在单独的文件中实现。因此，我的函数需要返回一个值，该值显示用户是否观看了完整的广告并获得了奖励。但是我无法弄清楚rewarded.onAdEvent事件以type === RewardedAdEventType.EARNED_REWARD结尾后如何返回值。我有一个调用广告和按钮组件的函数示例：

Ads.js片段

const showRewarded = () => {
    const rewarded = RewardedAd.createForAdRequest(UNIT_ID, {
      requestNonPersonalizedAdsOnly: false,
    });
    const eventListener = rewarded.onAdEvent((type, error, reward) => {
      if(type === RewardedAdEventType.LOADED) {
        rewarded.show();
      }
      if(type === RewardedAdEventType.EARNED_REWARD) {
        return reward;
      }
      // The reward should be null if user skiped the ad
      return null; 
    }); 
    rewarded.load();
    // Wait for event completion
  }

Button.js

import React from 'react';
import {
  View,
  Text,
  TouchableOpacity
} from 'react-native';;
import { Ads } from '../components';

class MyButton extends React.Component {

  constructor(props) {
    super(props);
  }

  showAd() {
    // Wait while user has not been get a reward (or skiped the ad)
    const reward = Ads.showRewarded();
    console.log(`The reward is ${reward}`);
  }

  render() {

    return (
      <View>
      <TouchableOpacity onPress={() => this.showAd()}>
        <Text>Show Ad to get a reward</Text>
      </TouchableOpacity>
      </View>
    )
  }
}

export default MyButton;

Answer 1

我认为有一个更好的解决方案，但是在未加载广告单元的情况下，我已经使用简单的setTimeout函数完成了此任务。看起来像这样：

const showRewarded = async () => {
    const rewarded = RewardedAd.createForAdRequest(UNIT_ID, {
      requestNonPersonalizedAdsOnly: false
    });
    var loaded = false;
    var gotReward = false;
    const eventListener = rewarded.onAdEvent((type, error, reward) => {
      if(type === RewardedAdEventType.LOADED) {
        rewarded.show();
        loaded = true;
      }
      else if(type === RewardedAdEventType.EARNED_REWARD) {
        gotReward = true;
      }
      else if(error) {
        console.warn(error);
      }
    }); 
    rewarded.load();
    while(!loaded) {
      await new Promise((resolve, reject) => setTimeout(resolve, 1000));
    }
    return gotReward;
  }

此函数仅在广告关闭后才返回gotReward。如果用户观看了所有广告，则为true，否则为false。

奖励广告是否已在React Native中观看

1 个答案: