我想根據索引號設定類。例如
<div > //item no 1 in v-for loop
<div > // item no 2
<div > // item no 3
<div > // item no 4
<div > // item no 5-7
我們怎樣才能做到這一點。
<div v-for="(destinations, index) in pageData.topDestinations" :key="index">
<div >
<div v-bind:style="`background-image:url('${destinations.destImage}');`"></div>
<div ></div>
<a href="#"></a>
<div >
<h5 >{{ destinations.name }}</h5>
<p >Starts {{ destinations.priceCurrency }} {{ destinations.priceStarts }}</p>
</div>
</div>
</div>
目前每次都有 col-md-4 類。但我希望它是動態的。
uj5u.com熱心網友回復:
嘗試按照以下方法在您<div>所在的位置設定一個類,v-for然后將索引傳遞給您的方法:
:
之后轉到您的方法并根據您的數字檢查您的索引并回傳寬度:
getWidth(index) {
if(index == 1) {
return "col-md-7";
}
if(index == 2) {
return "col-md-5"
}
....
if(index >= 5 && index <= 7) {
return "col-md-4";
}
注意:索引開始于0- 你的第一次檢查應該是if(index == 0)
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/339764.html
上一篇:除錯單個測驗時如何提供測驗標志?
