为了保证不重复调用广告组件,我们在全局app.vue文件引入,赋值到公共实例上
app.vue文件

<script>
	import * as config from '@/utils/config.js' //引入全局实例
	export default {
		// onLaunch: function () {
		//   console.log("App Launch");
		// },
		// onShow: function () {
		//   console.log("App Show");
		// },
		// onHide: function () {
		//   console.log("App Hide");
		// },
		onLaunch: function() {
			// 创建激励视频
			this.craeteVideo()
		},
		methods: {
			craeteVideo() {
				let _this = this;
				let rewardedVideoAd = tt.createRewardedVideoAd({
					adUnitId: '流量主id'
				})

				rewardedVideoAd.onLoad(() => {
					console.log('拉取激励广告成功')
				})

				rewardedVideoAd.onError((err) => {
					console.log('拉取激励广告失败')
				})

				config.videoAd = rewardedVideoAd // 我将创建好的实例保存在全局里,以便所有页面获取并使用

				rewardedVideoAd.onClose((res) => {
					if (res && res.isEnded) {
						console.log('激励广告全部加载完成')
					} else {
						console.log('激励广告中途强制关闭')
					}
				})
			},
		}

	};
</script>

config.js文件

export const videoAd = null

页面使用

<template>
<view class="jinrituijian" @click="click()">
</template>

<script>
	import * as config from '@/utils/config.js'
	export default {
		methods: {
			click() {
				// videoAd.show()
				if (config.videoAd) {
					config.videoAd.show(() => {
						// 到这里代表激励视频展示成功
					})
				}
			}
		}
	}
</script>
Logo

前往低代码交流专区

更多推荐