javascript - 动态改变vue组件中变量显示的样式

Question

我有一个使用 v-for 显示元素的 div，就像这样

<div v-for"element in example" :id="element+'id'">
{{element}}
</div>

如您所见，元素具有唯一的 ID。一切都正常，但我在特定的时刻需要不同的风格。当当前元素在括号中包含 ['some text'] 时，我想为该特定文本分配样式，而不是整个元素，只有括号中的文本。有没有简单的方法，或者？

Answer 1

如果三元(？运算符)返回 true，则应用一些样式。否则根本不要应用任何样式。

<div v-for"element in example" :id="element+'id'" :style="element.includes('[some text]') ? 'custom-css-styles-here' : ''">
    {{ element }}
</div>