uni-app对动态class和动态style的处理

uni-app和微信小程序针对动态class和动态style的处理

<view class="chartItem" :class="[positionClass(item.type)]" 
	:style="{ 'width':item.width+'%'}" v-for="item in list" :key="item.id" >
</view>
methods: {
	positionClass(type) {
        if(type=== 1){
			return ' name1'
		}else if(type=== 2){
			return ' name2'
		}else if(type=== 3){
			return ' name3'
		}else if(type=== 4){
			return ' name4'
		}else{
					
		}

	},
}
<style scoped lang="less">
	.name1{
		background-color: #2089E9
	}
					
	.name2{
		background-color: #34D698
	}
					
	.name3{
		background-color: #F4C135
	}
	.name4{
		background-color: #6C6C6C
	}
</style>

猜你喜欢

转载自blog.csdn.net/qq_35323539/article/details/126698469