vue中动态绑定class和style

原创于 2021-12-21 09:52:37 发布 · 310 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

vue 同时被 2 个专栏收录

17 篇文章

订阅专栏

前端

17 篇文章

订阅专栏

本文介绍了在前端开发中如何使用动态class和style绑定来灵活控制元素的样式。具体包括使用对象语法和数组语法实现条件样式应用的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

自己做个小笔记

	动态class对象：<div :class="{ 'is-active': true, 'red': isRed }"></div>
	动态class数组：<div :class="['is-active', isRed ? 'red' : '' ]"></div>
	动态style对象：<div :style="{ color: textColor, fontSize: '18px' }"></div>
	动态style数组：<div :style="[{ color: textColor, fontSize: '18px' }, { fontWeight: '300' }]"></div>