Le code complet pour le chargement automatique de petits programmes

Le contenu de cet article concerne le code complet pour le chargement automatique de petits programmes. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

<!-- 头部 -->
<view class=&#39;head&#39;>
<view data-order=&#39;1&#39; bindtap=&#39;clickorder&#39;><text class=&#39;{{a}}&#39;>售中({{count}})</text></view>
<view data-order=&#39;2&#39; bindtap=&#39;clickorder&#39;><text class=&#39;{{b}}&#39;>已售({{counts}})</text></view>
</view>
<block wx:if="{{choose==1}}">
<block wx:for="{{goods_list}}">
<view class=&#39;shop-middle&#39;>
<view class=&#39;shop-img&#39;>
<!-- <image mode=&#39;widthFix&#39; src="https://sungroow.com/{{item.image_middle}}"></image> -->
<image src="https://sungroow.com{{item.image_thumb}}"></image>
</view>
<view class=&#39;shop-num&#39;>
<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=&#39;onsale&#39;>下架</button>
</block>
<block wx:if="{{item.is_sale==0}}">
<button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap=&#39;onsale&#39;>上架</button>
</block>
</view>
</view>
</block>
</block>
 
<block wx:if="{{choose==2}}">
<block wx:for="{{order_list}}">
<view class=&#39;shop-middle&#39;>
<view class=&#39;shop-img&#39;>
<!-- <image mode=&#39;widthFix&#39; src="https://sungroow.com/{{item.image_middle}}"></image> -->
<image src="https://sungroow.com{{item.image_thumb}}"></image>
</view>
<view class=&#39;shop-num&#39;>
<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=&#39;onsale&#39;>下架</button>
</block>
<block wx:if="{{item.is_sale==0}}">
<button size="mini" type="default" data-goods="{{item.goods_id}}" bindtap=&#39;onsale&#39;>上架</button>
</block>
</view>
</view>
</block>
</block>
 
<view class=&#39;{{show}}&#39;>商品加载完毕</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(&#39;../../../utils/util.js&#39;)
Page({
 
/**
* 页面的初始数据
*/
data: {
show: &#39;is-hide&#39;,
page:0,
pages:0,
a: &#39;line&#39;,
b: &#39;&#39;,
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: &#39;line&#39;,
b: &#39;&#39;,
c: &#39;&#39;,
d: &#39;&#39;,
e: &#39;&#39;,
f: &#39;&#39;,
choose:1
})
that.index(that.data.store_id,that.data.page);
} else if (id == 2) { //待付款
var that = this
that.setData({
a: &#39;&#39;,
b: &#39;line&#39;,
c: &#39;&#39;,
d: &#39;&#39;,
e: &#39;&#39;,
f: &#39;&#39;,
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(&#39;key&#39;)
console.log(that.data.page)
that.setData({
key: key
})
com.POST({
url: &#39;Order/wait_pay_all&#39;,
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: &#39;is-show&#39;
})
} else {
// wx.showToast({
// title: &#39;暂无订单&#39;,
// icon: &#39;none&#39;,
// duration: 2000
// })
}
}
})
 
},
//上架
onsale(e){
var goods_id=e.currentTarget.dataset.goods
 
//最新
var that = this
wx.getStorage({
key: &#39;key&#39;,
success: function (res) {
com.POST({
url: &#39;Goods/on_sale&#39;,
data: {
key: res.data,
goods_id: goods_id
},
success: function (msg) {
console.log(msg)
if (msg.data.code == 200) {
wx.showModal({
title: &#39;温馨提示&#39;,
content: msg.data.datas,
success: function (res) {
if (res.confirm) {
wx.switchTab({
url: &#39;/pages/my/index&#39;
})
}
}
 
})
} else {
wx.showModal({
title: &#39;温馨提示&#39;,
content: msg.data.error,
success: function (res) {
if (res.confirm) {
wx.switchTab({
url: &#39;/pages/my/index&#39;
})
}
}
})
}
}
})
}
})
},
 
//设计师所有的商品
 
index(options,page){
//最新
var that = this
var list = that.data.goods_list;
var lists = [];
console.log(that.data.page)
wx.getStorage({
key: &#39;key&#39;,
success: function (res) {
com.POST({
url: &#39;Goods/goods_list&#39;,
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: &#39;is-show&#39;
})
// wx.startPullDownRefresh();
} else {
// wx.showModal({
// title: &#39;温馨提示&#39;,
// content: msg.data.error,
// success: function (res) {
// if (res.confirm) {
// // wx.switchTab({
// // url: &#39;/pages/index/index&#39;
// // })
// }
// }
// })
}
}
})
}
})
},
 
/**
* 生命周期函数--监听页面加载
*/
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 () {
}
})

Recommandations associées :

Exemple d'applet WeChat : Comment réaliser l'effet d'animation du chapiteau (avec code)

WeChat Exemple de mini-programme : collecte et suppression d'images et effets fonctionnels du changement d'image

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!