Vue.js綁定HTML class陣列語法錯誤,詳情如下圖:
當有多個條件class時這樣寫有些繁瑣。在1.0.19+中,可以在陣列語法中使用物件語法:
如果這樣寫是可以執行成功的,但有錯誤
data: { classA: 'class-a', classB: 'class-b', classC: 'class-c', isB: true, isC: false } <div :class="[classA, { classB: isB, classC: isC }]">
渲染為:
<div class="class-a classB">
<div :class="[classA, { 'class-b': isB, 'class-c': isC }]">
渲染為這樣的class-b 是不成功的,所以這裡還是要用標準的物件語法加上引號
<div class="class-a class-b">
渲染為:
rrreee🎜🎜🎜以上所述是小編給大家介紹的Vue.js綁定HTML class🎜🎜以上所述是小編給大家介紹的Vue.js綁定HTML class陣列語法錯誤,希望對大家有幫助,如果大家有任何疑問請給我留言,小編會及時回覆大家的。在此也非常感謝大家對PHP中文網的支持! 🎜🎜更多Vue.js綁定HTML class數組語法錯誤的原因分析相關文章請關注PHP中文網! 🎜