如何将json变量直接放入DIV类中

Question

我需要通过在脚本部分分配的数字来更改 div 元素的颜色。我正在使用 Nuxtjs 和 tailwind。

这是我想要工作的代码，但遗憾的是它没有。有人知道另一种方法可以达到相同的结果吗？

<template>
<div class = "bg-[ "{{color}}" ]">
</div>
</template>

<script>
let color = 12345
</script>

所以我想知道有没有办法将 json 变量直接放入 div 类中？

Answer 1

在

Vue.js

和

Nuxt

中，您可以使用

:class

（注意冒号）

输入 JS 变量

<template>
<div :class = "`bg-[${color}]`">
</div>
</template>

<script>
let color = 12345
</script>

这应该有效。确保您的变量在模板中可用。