vue绑定表格多种状态class的方式

土肥圆xulia

于 2019-06-13 09:48:03 发布

阅读量1k

点赞数

分类专栏： vue element

本文链接：https://blog.youkuaiyun.com/qq_39057641/article/details/91795193

版权

vue 同时被 2 个专栏收录

23 篇文章

订阅专栏

element

7 篇文章

订阅专栏

例子html

 <div v-else-if="iten.val=='Sex'">
		<span :class="{ 'sex_boy': scope.row.Sex == 0 , 'sex_girl': scope.row.Sex == 1 }">							
	    		<template  v-if="scope.row.Sex == 0" >男</template>
	    		<template  v-if="scope.row.Sex == 1" >女</template>												
		</span> 										
</div>

style

<style>
	.sex_boy{
		color: #fff;
		padding: 2px 10px;
    border: 1px solid #4ab9ff ;
    border-radius: 13px;  
    background-color: #4ab9ff;

	}
	.sex_girl{
		color: #fff;
		padding: 2px 10px;
    border: 1px solid #ff7ebb ;
    border-radius: 13px;
    background-color: #ff7ebb;

	}

 </style>