Excel教程Excel函数Excel表格制作Excel2010Excel实用技巧Excel视频教程

一、实现疗效

二、实现原理 1.根据该项目的点赞状态来确定是否将点赞数加1或则减1，设置初始为null，无点赞的状态，当我们点击点赞的按键时，才触发点赞的风波 2.当点赞的状态是false时，为取消点赞，将点赞数减1 3.当点赞的状态是true时快手双击点赞是什么功能快手双击点赞是什么功能，为点赞的功能，将点赞数加1 三、实现代码

页面的js代码

//test1.js
// pages/test3/test3.js
Page({
    /**
     * 页面的初始数据
     */
    data: {
        like:0,//点赞的初始值
        liked:false,//点赞的初始状态
        like_img1: "../../static/点赞.jpg",
        like_img2: "../../static/点赞active.jpg",
    },
 //点赞的事件绑定
likeinfo: function (e) {
  var data = this.data;
  var liked = data.liked;
// 判断当前状态是否为点赞状态
if(liked) {
// 如果是点赞状态，将状态切换为未点赞状态，数量减1
data.liked = false;
data.like=-1;
data.item.likes = Number(data.item.likes) + Number(data.like) 
} else {
// 如果是未点赞状态，将状态切换为点赞状态，数量加1
data.liked = true;
data.like=1;
data.item.likes = Number(data.item.likes) + Number(data.like) 
}
// 更新页面数据
this.setData(data);
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        var that = this;
        wx.request({
             url: "http://localhost/test/index.php",
            success: function (rep){
              console.log(rep.data)
             that.setData({
                items: rep.data,//原始的数据项
                items1:rep.data,//数据的中转站，用来显示被筛选的数据，也能够随时的清空不影响到其他数据的显示
                item:rep.data[0]
              });
          const itemsHeight = that.data.items.length * 50 // 假设每个 item 的高度为 50px
          wx.setStorageSync('pageHeight', `${itemsHeight}px`)//这两句命令的作用时设置文本框显示的高度，当一个item项里面有多行数据时，会自动调整文本框的高度
            }
        })   /*获取项目库的数据*/ 
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {
    },
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {
    },
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {
    },
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
    },
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
    },
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {
    }
})

页面的wxml代码

//test1.wxml

    
    
    {{item.likes}}

页面的wxss代码

test1.wxss
.icon1{
    width: 45rpx;
    height: 45rpx;
  }