我已经尝试将其作为自定义指令,但 JS 拒绝任何字符串(未终止的文字字符串)中的脚本标记。此外,vue-google-adsense 和 vue-adsense 插件对我不起作用,因为它们没有获得 Adsense 提供的所有参数,因此广告变得没有响应等。
最佳答案
在 index.html
文件中,将 adsense 代码添加到 #app 之外:
<div id="app"></div>
<div id="divadsensedisplaynone" style="display:none;">
<!-- put here all adsense code -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxx"
data-ad-slot="xxxxxx"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
在您的主 App.vue
或任何 Vue 文件中,将此添加到您希望显示广告的位置(您可以随意更改样式):
<div id="adsgoeshere" style="background: #1d1f29; padding-top:60px; text-align: center;" v-html="adsenseContent"></div>
在数据
中添加:
adsenseContent: ''
最后,在mounted
函数中,添加:
this.adsenseContent = document.getElementById('divadsensedisplaynone').innerHTML
就是这样! 您不需要任何库。
关于javascript - 如何在 Vue.js 组件中添加 google adsense?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54732437/