我需要一些幫助來嘗試弄清楚如何為 v-bind:class 提供多個選項。我的 Uno 游戲在循環遍歷您的卡片時,需要查看對象列表中的卡片顏色。([{ Color: green, Value: 6}]并確定卡片的文字顏色。這是我到目前為止所想出的:視圖.jsgetClass: function(card){ var result = []; console.log(card); if (card.Color == "red"){ result.push('red'); }else if (card.Color == "green"){ result.push('green'); }else if (card.Color == "blue"){ result.push('blue'); }else if(card.Color == "yellow"){ result.push('yellow'); } console.log(result); return result; },超文本標記語言<ul id="myCards"> <button id="myCard" v-for="card in myCards" v-bind:class="getClass(card)" @click="playCard(card)"> {{card.Color}} {{card.Value}} </button></ul>CSSul{ text-align: left;}#myCards{ padding: none;}#myCard{ display: inline-block; height: 100px; width: 70px; border: 1px solid black; color: black; border: 2px solid black; border-radius: 6px; background-color: white; color: black; vertical-align: middle; margin: 5px;}.red{ color: red;}.green{ color: green;}.blue{ color: blue;}.yellow{ color: yellow;}
- 0 回答
- 0 關注
- 175 瀏覽
添加回答
舉報
0/150
提交
取消