内联样式在VueJS中不起作用

Question

我一直在关注指南：https://vuejs.org/v2/guide/class-and-style.html#Binding-Inline-Styles以获取VueJS中的内联css。但是在某些情况下，它无法正常工作。

  

：style =“{background：colorSelected}”// work

以下错误说明： - 表达式无效:: style =“{border-color-left：colorSelected}”

  

：style =“{border-color-left：colorSelected}”//无法正常工作

Answer 1

对象文字的JavaScript语法无效。 object属性需要有引号：

:style="{ 'border-left-color': colorSelected }"

或者您可以像这样指定（特定于Vue）：

:style="{ borderLeftColor: colorSelected }"

此格式为border-left-color而非border-color-left。