app用的是H5+,然后现在情况是这样的，app内有资讯列表，隔6条插入一条信息流广告，怎么在一个列表里面插入多个广告？
目前写的demo，只能展示出一个广告，不能多个同时在列表展示
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title></title>
<script src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js" charset="utf-8"></script>
<script>
var vConsole = new VConsole();
</script>
<script type="text/javascript">
document.addEventListener('plusready', () => {
});
</script>
</head>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
#app {
width: 100vw;
height: 100vh;
overflow-y: auto;
}
#adv {
width: 100vw;
}
.addr {
width: 100vw;
height: 20vh;
background: #efeff4;
border-bottom: 1px solid #ccc;
line-height: 20vh;
text-align: center;
}
.addMore{
width: 100%;
height: 40px;
text-align: center;
line-height: 40px;
background: #c0c0c0;
}
</style>
<body>
<div id="app">
<div v-for="item in list" :key='item'>
<div class="addr">{{item}}</div>
<div class="adv" v-if="(item)%6 == 0" :ref='`adv${parseInt(item/6)}`' :data='`adv${parseInt(item/6)}`'></div>
</div>
<div @click="addMore" class="addMore">加载更多</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script type="text/javascript">
var app = new Vue({
el: '#app',
data: {
list: 0,
advList:[]
},
methods: {
addMore(){
this.list+=20
let i = parseInt(20/6)
for(let item=1;item<=i;item++){
console.log(item)
this.showAdView(`adv${item}`)
}
},
getAdData() {
return new Promise((resolve, reject) => {
let adata = ''
//获取广告数据
plus.ad.getAds({
adpid: '1111111111', //替换为自己申请获取的广告位标识，此广告位标识仅在HBuilderX标准基座中有效
width: '100%', //广告将要显示的宽度
count: 1 //注意实际业务中建议一次请求3-5条广告，避免请求到相同的广告
}, function(e) {
}, function(e) {
console.log('获取广告失败: ' + JSON.stringify(e));
resolve(adata)
});
})
},
showAdView(id) {
this.$nextTick(async ()=>{
let adDom = this.$refs[id][0]
console.log(adDom)
//创建AdView控件
adView = plus.ad.createAdView({
top: adDom.offsetTop + 'px',
left: '0px',
width: '100%',
height: '0px',
position: 'static'
});
//将AdView添加到Webview窗口中
plus.webview.currentWebview().append(adView);
//监听AdView渲染完成事件，动态调整高度
adView.setRenderingListener(function(e) {
console.log('渲染广告完成: ' + JSON.stringify(e));
if (0 != e.result) {
console.log('渲染失败！');
} else {
//调整广告控件高度，显示广告内容；调整广告控件的top值，避免渲染过程中top值发生变化导致的广告位置不对的问题。
adView.setStyle({
top: adDom.offsetTop + 'px',
height: e.height + 'px'
});
//调整占位div高度，避免被广告控件盖住DOM元素
adDom.style.height = e.height + 'px';
}
});
//监听用户关闭广告控件事件
adView.setDislikeListener(function(e) {
console.log('用户关闭广告: ' + JSON.stringify(e));
adView.close(), adView = null;
//调整占位div高度，避免关闭广告控件后显示空白区域
adDom.style.height = '0px';
});
//绑定并渲染广告数据
let adata = await this.getAdData()
if(adata){
adView.renderingBind(adata)
}
})
}
}
})
</script>
</html>
1 个回复
1***@qq.com
大佬问下开通了基础的广告 在那个地方可以拿到adpid？？急