vue通过data值改变css样式

一，绑定class1..centerActive为class样式名，满足后面的条件时则class为centerActive2.frame-item-active 和frame-item为class名，满足条件为frame-item-active ，不满足则为frame-item3.active-btn 和 all-btn为class名，满足条件时class为...

maoer9999

4540人浏览 · 2020-08-18 11:20:01

maoer9999 · 2020-08-18 11:20:01 发布

一，绑定class

centerActive为class样式名，满足后面的条件时则class为centerActive

frame-item-active 和 frame-item为class名，满足条件为frame-item-active ，不满足则为 frame-item

active-btn 和 all-btn为class名，满足条件时class为 active-btn 和 all-btn，不满足条件时为all-btn

二，绑定style

这一种是属于样式值涉及到最后一个子元素，不能用传统绑定style或者class的方式，则想到这个

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}$/, //不连续的两位字母// /^