微信小程序开发之列表页面点赞代码(图文)-1688源码网

微信小程序开发之列表页面点赞代码(图文)

1688源码 | 2017-10-01 11:18:16 |

微信小程序列表页面点赞代码(图文)

wxml代码：

<view class="zan{{currentItem==item.id?'active-tag':''}}" bindtap="dig" data-id="{{item.id}}" data-classid="{{item.classid}}" data-isLike="{{item.isLike}}">
<text>{{item.diggtop}}</text>
</ view>

js代码：

dig: function (e) {
    var $data = e.currentTarget.dataset;
    var id=$data.id
    var that=this
    var list=new Array()
    wx.request({
      url: getApp().globalData.URL + '/e/extend/api/index.php?m=piclist&c=dig',
      data:{
        id: $data.id,
        classid: $data.classid
      },
      method:'GET',
      success: function (res) {
        console.log(res.data)
          that.data.list.forEach(item => {
            if (item.id===id) {
              console.log(item.id)
              console.log(id)
              if (res.data.codes==0){
              if(item.islLke){
                item.diggtop--
                }
              else {
                item.diggtop++

              }
              }
              else{
              }
              item.isLike = !item.isLike
              console.log(item.isLike)
            }
          })
          that.setData({
            list: that.data.list,
            'currentItem': id
          })
      }
    })

  }

wxss代码：

.zan{
margin-left: 2px;
width: 20px;
background: url('/images/dig.png') no-repeat;
background-size: 18px 18px
}
.zanactive-tag{
margin-left: 2px;
width: 20px;
background: url('/images/dig_1.png') no-repeat;
background-size: 18px 18px;
color: red;

}
.zanactive-tag text{
line-height: 20px;
padding-left: 25px;
width: 40px;
display: inline-block
}
.zan text{
line-height: 20px;
padding-left: 25px
}