I want to make that styles are added to images only under a certain condition.
Here is code:
<div>
<div v-for="(item, index) in productsList" :key="item.id" class="cart-img">
<img
v-if="item.file"
:src="
`https://server.com/${
index === productsListBigIndex ? item.fileWide : item.file
}`
"
:alt="item.altText || item.text"
draggable="false"
/>
<img
v-else
:alt="item.altText || item.text"
:src="'https://server.com/empty.png'"
/>
<p style="font-size: medium">{{item.text}}</p>
</div>
</div>
The style should depend on the index
and productsListBigIndex
. For example, if the index is 0 or 2, then this style (in particular the size of the picture) will be added, otherwise it will not.
Thanks for answers!
<div v-bind:class="[isActive ? activeClass : '', errorClass]"></div>
像这样,您可以有条件地添加或删除指定的类名和样式,
v-bind:class="getClass()"
methods:{
getClass(){
//logic to check the condition and return the class name
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.