vue.js Nuxt添加动态脚本标记

y1aodyip  于 2022-11-25  发布在  Vue.js
关注(0)|答案(1)|浏览(252)

我使用的是nuxt-js,并具有以下脚本标记

  1. <script type="text/javascript">
  2. atOptions = {
  3. 'key' : 'id',
  4. 'format' : 'iframe',
  5. 'height' : 60,
  6. 'width' : 468,
  7. 'params' : {}
  8. };
  9. document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://www.highperformancedisplayformat.com/id/invoke.js"></scr' + 'ipt>');
  10. </script>

当我在nuxt.config.js上使用一个类似这样的简单脚本标记时,它是有效的

  1. script:[
  2. { src:'//data.profitablegatetocontent.com/c6/4b/7a/id.js'
  3. }]

但是由于我必须使用的脚本标记有点复杂,我感到困惑,任何帮助都将不胜感激。

qacovj5a

qacovj5a1#

快来救我!
添加动态脚本标记的另一种方法是head()
例如,在默认布局中:

  1. <script>
  2. export default {
  3. data() {
  4. return {
  5. title: 'Hello World!'
  6. }
  7. },
  8. head() {
  9. return {
  10. title: this.title,
  11. script: [
  12. {
  13. hid: '',
  14. src: '',
  15. defer: true,
  16. type: '',
  17. innerHTML: ,
  18. callback: () => { }
  19. }
  20. ],
  21. meta: [
  22. {
  23. hid: 'description',
  24. name: 'description',
  25. content: 'My custom description'
  26. }
  27. ]
  28. }
  29. }
  30. }
  31. </script>
展开查看全部

相关问题