1. class:

// 判断isreply是否为false, 若为false, 则拥有m-light-reply的class名
<div :class="{'m-light-reply': !isreply}">
</div>
// 判断isNike是否为true; true使用nikeHeader的class, 否则用detail_container_title的class
<header v-bind:class="[isNike ? 'nikeHeader' : 'detail_container_title']">
    {{headerData.title}}
</header>

2. style:

// 定义fontSize变量然后动态赋值;或者判断isNike是否为true, 对css属性进行三目判断
<div :style="{'font-size': fontSize + 'px', 'margin-bottom' : isNike ? '0' : '20px'}">
</div>

 

Logo

Vue社区为您提供最前沿的新闻资讯和知识内容

更多推荐