Vue.js綁定HTML class陣列語法錯誤的原因分析

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, { &#39;class-b&#39;: isB, &#39;class-c&#39;: isC }]">

渲染為這樣的class-b 是不成功的，所以這裡還是要用標準的物件語法加上引號

<div class="class-a class-b">

渲染為：

rrreee🎜🎜🎜以上所述是小編給大家介紹的Vue.js綁定HTML class🎜🎜以上所述是小編給大家介紹的Vue.js綁定HTML class陣列語法錯誤，希望對大家有幫助，如果大家有任何疑問請給我留言，小編會及時回覆大家的。在此也非常感謝大家對PHP中文網的支持！ 🎜🎜更多Vue.js綁定HTML class數組語法錯誤的原因分析相關文章請關注PHP中文網！ 🎜