微信小程序 图片自适应及改变点击之后的样式

图片宽高自适应

wxml：<image src="图片路径" mode="widthFix"></image>

wxss： image{
 width:100vw;
}

点击之后改变样式:

wxml：

  <view class="content_hp {{select == item.cateid ? 'moren':''}}" wx:for="{{cate}}">
<text data-cateid="{{item.cateid}}" bindtap="selectC" >{{item.catename}}</text>
</view>

wxss:

.moren{
  border-bottom:1px solid red;
  color:red;
}

js:

 data: {
   select:2,
  },

selectC:function(e){
    var that = this;
    var cateid = e.currentTarget.dataset.cateid;
    this.setData({
      select: cateid
    })

}