微信小程序加减颜色不同效果的实现（积分加减记录颜色改变，或者其他类似效果）-即速应用

微信小程序加减颜色不同效果的实现（积分加减记录颜色改变，或者其他类似效果）

浏览量：467 时间：2019-12-20 来源：哎吆我呸

view class='list' wx:for="{{detaillist}}" wx:for-item="item"        view          view class="title"{{item.title}}/view          view class="time"{{item.time}}/view        /view        view class="point {{item.isAdd?'on':''}}"{{item.point}}/view    /view

/* pages/pointdetail/pointdetail.wxss */.top{  width: 100%;  height: 300rpx;}.list{  padding: 30rpx 40rpx;  display: flex;  align-items: center;  justify-content: space-between;  border-bottom: 1px solid #eee;}.title{  color: #1f1f1f;  font-size: 36rpx;  line-height: 36rpx;}.time{  margin-top: 20rpx;  color:#999999;  font-size: 30rpx;  line-height: 36rpx;}.point{  color:#333333;  font-size: 36rpx;  line-height: 36rpx;}.point.on{  color:#fe0000;  font-size: 36rpx;  line-height: 36rpx;}.jf{  width: 44rpx;  height: 40rpx;}.pointnum{  margin-left: 20rpx;  color:white;  font-size: 48rpx;  line-height: 36rpx;}.pointtitle{  margin-top: 20rpx;  width: 100%;  display: flex;  justify-content: center;  align-items: center;  color:white;  font-size: 30rpx;  line-height: 36rpx;}.pointmingxi{  width: 100%;  display: flex;  justify-content: center;  align-items: center;  padding: 90rpx 0rpx 0rpx 0rpx;}

data: {      point:8765,      detaillist:[        {          title:"购物消费",          time:"2018-09-27",          point:"-100",          isAdd:false,        },        {          title: "购物消费",          time: "2018-09-27",          point: "+100",          isAdd: true,        },        {          title: "购物消费",          time: "2018-09-27",          point: "-100",          isAdd: false,        },        {          title: "购物消费",          time: "2018-09-27",          point: "+100",          isAdd: true,        },        {          title: "购物消费",          time: "2018-09-27",          point: "+100",          isAdd: true,        }      ],}