您好,登錄后才能下訂單哦!
這篇文章主要介紹了小程序如何實(shí)現(xiàn)自動(dòng)加載,具有一定借鑒價(jià)值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
小程序?qū)崿F(xiàn)自動(dòng)加載的完整代碼
<!-- 頭部 --> <view class='head'> <view data-order='1' bindtap='clickorder'><text class='{{a}}'>售中({{count}})</text></view> <view data-order='2' bindtap='clickorder'><text class='{}'>已售({{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({ /** * 頁(yè)面的初始數(shù)據(jù) */ 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: '暫無(wú)訂單', // 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' }) } } }) } } }) } }) }, //設(shè)計(jì)師所有的商品 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' // // }) // } // } // }) } } }) } }) }, /** * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面加載 */ 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) }, /** * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面初次渲染完成 */ onReady: function () { }, /** * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面顯示 */ /** * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面隱藏 */ onHide: function () { }, /** * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面卸載 */ onUnload: function () { }, //滾動(dòng)到底部觸發(fā)事件 onReachBottom: function () { let that = this; console.log("上拉", that.data.pages) // if (that.data.searchLoading && !that.data.searchLoadingComplete) { that.setData({ pages: that.data.pages + 1, //每次觸發(fā)上拉事件,把searchPageNum+1 // isFromSearch: false //觸發(fā)到上拉事件,把isFromSearch設(shè)為為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) } }, /** * 頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽(tīng)用戶(hù)下拉動(dòng)作 */ onPullDownRefresh: function () { wx.stopPullDownRefresh() }, /** * 用戶(hù)點(diǎn)擊右上角分享 */ onShareAppMessage: function () { } })
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享的“小程序如何實(shí)現(xiàn)自動(dòng)加載”這篇文章對(duì)大家有幫助,同時(shí)也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,更多相關(guān)知識(shí)等著你來(lái)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。