DIV CSS 佈局教程網

Vue.js綁定HTML class數組語法錯誤，詳情如下所示：

昨天在官網教程上發現一個錯誤是這樣的，下面看圖

http://cn.vuejs.org/guide/class-and-style.html

當有多個條件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">

如果是短橫符這樣的 class-b 是不成功的，所以這裡還是要用標准的對象語法加上引號

<div :class="[classA, { 'class-b': isB, 'class-c': isC }]">

渲染為：

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

以上所述是小編給大家介紹的Vue.js綁定HTML class數組語法錯誤，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對網站的支持！