在Nuxt插件中,可以使用context
对象中的head
属性来动态添加脚本标签到页面的头部。具体步骤如下:
my-plugin.js
。context
和其他需要的参数。context.head
来访问头部对象,并使用context.head.script.push()
方法来添加脚本标签。可以根据需要设置脚本标签的属性,如src
、async
、defer
等。export default
将插件函数导出。nuxt.config.js
配置文件中,将插件引入。可以使用plugins
属性或build
属性中的plugins
选项。下面是一个示例代码,演示了如何在插件中添加动态脚本标签:
// my-plugin.js
export default ({ head }, options) => {
head.script.push({
src: options.scriptSrc,
async: true
})
}
// nuxt.config.js
export default {
plugins: [
{ src: '~/plugins/my-plugin.js', options: { scriptSrc: 'https://example.com/myscript.js' } }
]
}
在上面的示例中,插件函数使用options
参数来接收传入的脚本URL,并将脚本标签添加到头部对象中。
这样,当应用启动时,插件会被加载并执行,动态脚本标签也会被添加到页面的头部。
领取专属 10元无门槛券
手把手带您无忧上云