vue 怎么执行这段代码里面的script <div> <script> console.log(1231231231232222); window.dataLayer = window.dataLayer || []; function gtag() { dataLayer.push(arguments); } gtag("js", new Date()); gtag("config", "G-LR9XVHCN1K"); </script> </div>
时间: 2024-02-14 17:15:54 浏览: 26
在 Vue.js 中,使用 `v-html` 指令绑定的数据会被当作普通的 HTML 插入到页面中,而不会被解析成 JavaScript 代码执行。这是出于安全考虑,避免恶意代码被执行。
如果你想要在 Vue.js 中执行 `<div><script>console.log(1231231231232222);window.dataLayer = window.dataLayer || [];function gtag() {dataLayer.push(arguments);}gtag("js", new Date());gtag("config", "G-LR9XVHCN1K");</script></div>` 中的 script 代码,可以使用 `vm.$nextTick()` 方法在插入 HTML 后手动执行 JavaScript 代码。示例如下:
```html
<template>
<div>
<div v-html="scriptCode"></div>
</div>
</template>
<script>
export default {
data() {
return {
scriptCode: '<div><script>console.log(1231231231232222);window.dataLayer = window.dataLayer || [];function gtag() {dataLayer.push(arguments);}gtag("js", new Date());gtag("config", "G-LR9XVHCN1K");</script></div>'
}
},
mounted() {
this.$nextTick(() => {
const scriptEl = this.$el.querySelector('script')
if (scriptEl) {
// 手动执行 script 代码
eval(scriptEl.innerText)
}
})
}
}
</script>
```
注意,使用 `eval()` 函数执行动态代码存在安全隐患,应该谨慎使用,尽量避免将未知来源的代码插入到页面中执行。