Home >WeChat Applet >Mini Program Development >The complete code for automatic loading of small programs
This article brings you the complete code for automatic loading of small programs. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.
<!-- 头部 --> <view class='head'> <view data-order='1' bindtap='clickorder'><text class='{{a}}'>售中({{count}})</text></view> <view data-order='2' bindtap='clickorder'><text class='{{b}}'>已售({{counts}})</text></view> </view> <block wx:if="{{choose==1}}"> <block wx:for="{{goods_list}}"> <view class='shop-middle'> <view class='shop-img'> <!-- <image mode='widthFix' src="https://sungroow.com/{{item.image_middle}}"></image> --> <image src="https://sungroow.com{{item.image_thumb}}"></image> </view> <view class='shop-num'> <view>{{item.goods_name}}</view> <view>¥ {{item.price}}</view> </view> <view class="but_all"> <block wx:if="{{item.is_sale==1}}"> <button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap='onsale'>下架</button> </block> <block wx:if="{{item.is_sale==0}}"> <button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap='onsale'>上架</button> </block> </view> </view> </block> </block> <block wx:if="{{choose==2}}"> <block wx:for="{{order_list}}"> <view class='shop-middle'> <view class='shop-img'> <!-- <image mode='widthFix' src="https://sungroow.com/{{item.image_middle}}"></image> --> <image src="https://sungroow.com{{item.image_thumb}}"></image> </view> <view class='shop-num'> <view>{{item.goods_name}}</view> <view>x{{item.goods_number}}件</view> <view>¥ {{item.goods_price}}</view> </view> <view class="but_all"> <block wx:if="{{item.is_sale==1}}"> <button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap='onsale'>下架</button> </block> <block wx:if="{{item.is_sale==0}}"> <button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap='onsale'>上架</button> </block> </view> </view> </block> </block> <view class='{{show}}'>商品加载完毕</view> /* //顶部 */ .head { position: relative; width: 100%; height: 60rpx; flex-direction: row; display: flex; align-items: center; /* left: -20rpx; */ border-bottom: 1.4px #e6e6e6 solid; border-top: 1.4px #e6e6e6 solid; } .head view { position: relative; /* margin-left: 52rpx; */ font-size: 27rpx; color: #414141; display: flex; justify-content:center; width: 50%; } .line{ border-bottom:1.4px #414141 solid; } /*主体 */ .shop-middle{ position: relative; height: 170rpx; width: 100%; border-bottom: 1.4px #e6e6e6 solid; border-top: 1.4px #e6e6e6 solid; padding-top:10rpx; } .shop_rank image{ position: relative; height:32rpx; width:74rpx; } .shop-img { display: flex; flex-direction: row; width: 25%; font-size: 29rpx; } .shop-img image { height:160rpx; width:160rpx; margin-right:22rpx; } .shop-num { justify-content: space-between; position: absolute; left: 200rpx; width: 75%; display: flex; flex-direction: column; font-size: 25rpx; top:0rpx; } .shop-num view { position: relative; margin-top: 15rpx; overflow: hidden; } .but_all{ position:relative; left:620rpx; top:-50rpx; } .is-show{ position: relative; width: 100%; height: 70rpx; display:flex; justify-content:center; align-items:center; font-size:28rpx; /* border-top:1.4px #e6e6e6 solid; */ } .is-hide{ display: hidden; } var app = getApp() var com = require('../../../utils/util.js') Page({ /** * 页面的初始数据 */ data: { show: 'is-hide', page:0, pages:0, a: 'line', b: '', goods_list:[], count:0, counts:0, choose:1, order_list:[] }, // 头部 clickorder(e) { var that = this console.log(e) var id = e.currentTarget.dataset.order if (id == 1) { that.setData({ a: 'line', b: '', c: '', d: '', e: '', f: '', choose:1 }) that.index(that.data.store_id,that.data.page); } else if (id == 2) { //待付款 var that = this that.setData({ a: '', b: 'line', c: '', d: '', e: '', f: '', choose:2 }) that.getindex(that.data.page) } }, //获取全部订单 getindex: function (page) { var that = this; var list = that.data.order_list; console.log(list) var lists = []; var key = wx.getStorageSync('key') console.log(that.data.page) that.setData({ key: key }) com.POST({ url: 'Order/wait_pay_all', data: { key: that.data.key, pay_status: 2, shipping_status: 1, order_status: 1, limit:10, page:page }, success: function (msg) { console.log(msg.data.datas) if (msg.data.code == 200) { lists = list.concat(msg.data.datas) that.setData({ page:that.data.page+1, counts: msg.data.datas[0].countsss, order_list: lists, show: 'is-show' }) } else { // wx.showToast({ // title: '暂无订单', // icon: 'none', // duration: 2000 // }) } } }) }, //上架 onsale(e){ var goods_id=e.currentTarget.dataset.goods //最新 var that = this wx.getStorage({ key: 'key', success: function (res) { com.POST({ url: 'Goods/on_sale', data: { key: res.data, goods_id: goods_id }, success: function (msg) { console.log(msg) if (msg.data.code == 200) { wx.showModal({ title: '温馨提示', content: msg.data.datas, success: function (res) { if (res.confirm) { wx.switchTab({ url: '/pages/my/index' }) } } }) } else { wx.showModal({ title: '温馨提示', content: msg.data.error, success: function (res) { if (res.confirm) { wx.switchTab({ url: '/pages/my/index' }) } } }) } } }) } }) }, //设计师所有的商品 index(options,page){ //最新 var that = this var list = that.data.goods_list; var lists = []; console.log(that.data.page) wx.getStorage({ key: 'key', success: function (res) { com.POST({ url: 'Goods/goods_list', data: { key: res.data, store_id: options.store_id, limit: 10, page: page, is_sale: 1 }, success: function (msg) { console.log(msg) if (msg.data.code == 200) { lists = list.concat(msg.data.datas) console.log(lists) that.setData({ page:that.data.page +1, goods_list: lists, count: msg.data.datas[0].count, show: 'is-show' }) // wx.startPullDownRefresh(); } else { // wx.showModal({ // title: '温馨提示', // content: msg.data.error, // success: function (res) { // if (res.confirm) { // // wx.switchTab({ // // url: '/pages/index/index' // // }) // } // } // }) } } }) } }) }, /** * 生命周期函数--监听页面加载 */ onShow: function (options) { this.index(this.data.store_id, this.data.pages) this.getindex(this.data.pages) }, onLoad: function (options){ this.setData({ store_id: options }) this.index(options, this.data.pages) this.getindex(this.data.pages) }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { }, //滚动到底部触发事件 onReachBottom: function () { let that = this; console.log("上拉", that.data.pages) // if (that.data.searchLoading && !that.data.searchLoadingComplete) { that.setData({ pages: that.data.pages + 1, //每次触发上拉事件,把searchPageNum+1 // isFromSearch: false //触发到上拉事件,把isFromSearch设为为false }); // console.log(that.data.counts, that.data.count) if (that.data.choose==2){ that.getindex(that.data.pages) } else if (that.data.choose == 1){ that.index(that.data.store_id, that.data.pages) } }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { wx.stopPullDownRefresh() }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } })
Related recommendations:
WeChat Mini Program Example: How to achieve the animation effect of the marquee (with code)
The above is the detailed content of The complete code for automatic loading of small programs. For more information, please follow other related articles on the PHP Chinese website!