如何在 Vue.js 組件中添加 google adsense？

Question

我已經嘗試將其作為自定義指令，但 JS 拒絕任何字符串中的腳本標記（未終止的文字字符串）。 此外，vue-google-adsense 和 vue-adsense 插件對我不起作用，因為它們沒有獲得 Adsense 提供的所有參數，因此廣告變得沒有響應等。

Answer 1

在index.html文件中，從 #app 中添加 adsense 代碼：

<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>

在data添加：

 adsenseContent: ''

最后，在mounted函數中，添加：

this.adsenseContent = document.getElementById('divadsensedisplaynone').innerHTML

就是這樣！ 你不需要任何圖書館。