Analyse des causes des erreurs de syntaxe dans la liaison des tableaux de classes HTML dans Vue.js

Erreur de syntaxe du tableau de classes HTML de liaison Vue.js, les détails sont les suivants :

Écrire comme ceci est un peu fastidieux lorsqu'il y a plusieurs classes conditionnelles. Dans la version 1.0.19, vous pouvez utiliser la syntaxe objet dans la syntaxe tableau :

Si vous l'écrivez comme ceci, il peut être exécuté avec succès, mais il y aura une erreur

data: {
classA: 'class-a',
classB: 'class-b',
classC: 'class-c',
isB: true,
isC: false
}
<div :class="[classA, { classB: isB, classC: isC }]">

Rendu comme :

<div class="class-a classB">

S'il s'agit d'un tiret comme la classe-b, il échoue, vous devez donc toujours utiliser la syntaxe d'objet standard ici avec des guillemets

<div :class="[classA, { &#39;class-b&#39;: isB, &#39;class-c&#39;: isC }]">

est rendu comme suit :

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

Ce qui précède est l'erreur de syntaxe de liaison du tableau de classes HTML dans Vue.js introduite par l'éditeur. J'espère que cela aidera tout le monde. Si vous avez des questions, laissez-moi un message et je vous répondrai à temps. Je voudrais également vous remercier tous pour votre soutien au site Web PHP chinois !

Pour plus d'articles connexes analysant les causes des erreurs de syntaxe dans les tableaux de classes HTML de liaison Vue.js, veuillez faire attention au site Web PHP chinois !