商城小程序-- 专题精选

一、滚动效果

二、上一页 下一页 

2.1 灰色 或 可点击效果

* 首先是设置 showPage 整体可以显示或隐藏 

* 根据数据当前页号 和数据量设置

<view class="page" wx:if="{{showPage}}">
    <view class="prev {{ page <= 1 ? 'disabled' : ''}}" bindtap="prevPage">上一页</view>
    <view class="next {{ (count / size) < page +1 ? 'disabled' : ''}}" bindtap="nextPage">下一页</view>
</view>

样式颜色为灰色

.page .disabled{
    color: #ccc;
}

2.2 上一页 下一页按钮

data: {
        // text:"这是一个页面"
        topicList: [],
        page: 1,
        size: 10,
        count: 0,
        scrollTop: 0,
        showPage: false
    }

that.setData({
              scrollTop: 0,
              topicList: res.data.data,
              showPage: true,
              count: res.data.count
   });

数据和页号 后台返回，进行赋值

三、精选留言

其实是一个连接，点击图片跳转到页面

 <image bindtap="postComment" class="i" src="47c3f.png"></image>

postComment() {
    wx.navigateTo({
      url: '/pages/commentPost/commentPost?valueId=' + this.data.id + '&typeId=1',
    })
  }

内容长度处理

bindInpuntValue(event){


    let value = event.detail.value;


    //判断是否超过140个字符
    if (value && value.length > 140) {
      return false;
    }


    this.setData({
      content: event.detail.value,
    })
    console.log(event.detail)
  }

【问题】