ホームページ >WeChat アプレット >ミニプログラム開発 >小さなプログラムを自動ロードするための完全なコード
この記事は、小さなプログラムの自動読み込みのための完全なコードを提供します。必要な方は参考にしていただければ幸いです。
<!-- 头部 --> <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 () { } })
関連する推奨事項:
WeChat ミニ プログラムの例: マーキーのアニメーション効果を実現する方法 (コード付き)
WeChat ミニ プログラムの例: コレクションとお気に入りの写真、および写真を切り替える機能効果
以上が小さなプログラムを自動ロードするための完全なコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。