如何在vue js中的select选项中设置动态样式

Question

the parameter is not present

我需要<select v-model="selectcurrency" @change="[get(),ready(),setcookie()]" class="selectpicker" data-live-search="true" data-width="120px" style="width: 80px;"> <option v-for="item in currency" :value="item" :style="color:'red'" //this style> @{{item.symbol}} -- @{{ item.name }} </option> </select> 标记option，如果item.count，则将其涂成黑色，如果item.count > 0则将其涂成红色。

然后item.count < 0标记中的图片option，但这不起作用

item.image

Answer 1

您可以将Class And Style Bindings与Ternary Operator

一起使用

在你的情况下：

<option v-for="item in currency" :value="item"
    :style="{ color: item.count > 0 ? 'red' : 'black'" //use like this>
    @{{item.symbol}} -- @{{ item.name }}
</option>