vue中一个标签中含有多个class（其中包含三元表达式）的写法

1、数组形式<div :class='["classify",current=="0" ? "active" : ""]'@click='current=0'>课程</div>注意：数组中的classify如果不加引号的话，代表的是data中的一项，并不是类名，将

小地瓜呱

39060人浏览 · 2018-11-20 10:04:04

小地瓜呱 · 2018-11-20 10:04:04 发布

1、数组形式

<div :class='["classify",current=="0" ? "active" : ""]'  @click='current=0'>课程</div>

注意：数组中的classify如果不加引号的话，代表的是data中的一项，并不是类名，将classify加上双引号，变成字符串就可以变成类名

2、字符串拼接

<div :class="'classify'+(current=='0'?' active':'')"  @click='current=0'>课程</div>

注意：active前要加一个空格（必须有），字符串拼接时，两个字符串之间要有空格

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^