uni-app动态绑定class和style

动态绑定calss

1. class="[{‘类名’:条件},{‘类名’:条件},{‘类名’:条件}]"
   为不同条件的image绑定不同的样式

	<image 
	 class="img1" 
     :class="[{'img1':index == 0},{'img2':index == 1},{'img3':index == 2}]"
     :src="avtUrl" 
    >
</image>

2. 数组的方式，直接绑定多个 class 属性

   // 数组的方式，直接绑定多个 class 属性
    <view :class="['green', 'font-big','font-bold' ]" ></view>

动态绑定style

   // 绑定单个内联样式
    <view :style="{'display':config.isHaveSearch ? 'block':'none'}" ></view>
    <view :style="{color:item.age<18?'#ccc':''}"></view>
    
    <view :style="{ color: activeColor, fontSize: fontSize + 'px' }"></view>
    <view :style="[{ color: activeColor, fontSize: fontSize + 'px' }]"></view>

// 复杂情况
		<text 
		 class="title" 
		 :style="'filter:grayscale('+(funding>'0'?'100%':'0')+')'" 
		 style="color:red;"
		>
		{{title}}
		</text>