微信小程序动态绑定style样式

homeOutObj.color是你js文件里面设置的颜色，可以根据用户操作改变值，达到动态渲染效果，如果样式比较复杂的话建议绑定动态class

传送门：绑定动态class

第一种，通过变量值直接绑定样式：

JS:

data: {
	homeOutObj: {
	    color:'red',
	    fontSize:'14rpx'
	}
}

changStyle() { // 通过js方法动态改变绑定的style样式
    this.setData({
        homeOutObj: {
			color:'blue',
	    	fontSize:'16rpx'
 		}
    })
},

WXML:

<view class="tab-header">
    <view style="background:{{homeOutObj.color}};font-size:{{homeOutObj.fontSize}}">内容区域</view>
</view>

第二种，写个三目运算符，根据变量实现动态绑定样式

JS:

data: {
	showRed: true
}

changData() { // 通过js方法动态改变绑定的变量
	if(this.data.showRed) {
		this.setData({
	        showRed: false
	    })
	}else {
	    this.setData({
	        showRed: true
	    })
	}
},

showRed为true时，显示红色，否则显示蓝色

<view class="tab-header">
    <view style="background:{{showRed? 'red' : 'blue'}}" >内容区域</view>
</view>