vue动态绑定class、style、background
动态绑定class
:class=" currentindex == 1 ? 'selected' : ' ' " :class=" currentindex ? 'selected' : ' ' "
动态绑定style
动态样式判断
:style="{color:active==true?'#ffffff':'#333333'}"动态绑定background背景图
:style="{ backgroundimage: 'url(' + backgroundimage + ')' }"vue动态绑定多个class
非动态样式与动态样式一起绑定
animate__animated是使用animate动画必须要带的值,用字符串即可。
后面的animate__shakex用对象包裹,动态给布尔值。
<el-tag
type="success"
effect="dark"
@click="flag = !flag"
:class="['animate__animated', { animate__shakex: flag }]"
>点我晃动</el-tag
>data() {
return {
flag: true,
};
},总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持代码网。
发表评论