v-bind:style 指令不适用于条件比较

Question

我可以根据条件将 class 绑定到 vue 中的元素，如下所示：

:class="i18n.global.locale == 'ar' ? 'class1': 'class2'"

但是当我尝试用相同的条件绑定 style 时：

:style="[i18n.global.locale == 'ar' ? { 'background': 'blue;' }: { 'background': 'red' } ]"

styles 均未应用于该元素。为什么 :style 指令不起作用？

这两个指令都应用于​​包含所有其他元素的 container div。

Answer 1

我对你的问题做了一些研究，所以要解决它你可以这样做：

1. 检查浏览器开发工具中的元素样式，可能会覆盖 css 文件中的绑定样式，例如，如果您有指向 css 文件的链接
2. 这里{ 'background': 'blue;' }尝试删除';'，至于我，它在我删除后开始工作。