54. Página de consulta de pedido_Obtener datos de la interfaz de pedido
Lógica empresarial de la página de consulta de pedidos
1 OnShow cuando se abre la página
onshow不同于onLoad 无法在形参上接收options参数
判断缓存中有没有token (1 没有直接跳转到授权页面,2 有直接往下进行)
获取url上的参数type
根据type去发送请求获取订单数据
渲染页面
2 Haga clic en un título diferente para volver a enviar la solicitud para obtener y representar los datos, las páginas del
documento de la interfaz de consulta del orden histórico
\ order \ index.js
// pages/order/index.js
Page({
/**
* 页面的初始数据
*/
data: {
tabs:[
{
id: 0,
value:"全部",
isActive: true
},
{
id: 1,
value:"待付款",
isActive: false
},
{
id: 2,
value:"代发货",
isActive: false
},
{
id: 3,
value:"退款/退货",
isActive: false
}
]
},
onShow(options){
const token = wx.getStorageSync("token");
if (!token) {
wx.navigateTo({
url: '/pages/auth/index'
});
return;
}
// 1 获取当前的小程序的页面栈-数组长度最大是10页面
let pages = getCurrentPages();
// 2 数组中索引最大的页面就是当前页面
let currentPage=pages[pages.length-1];
console.log(currentPage.options);
// 3 获取url上的type参数
const {
type}=currentPage.options;
this.getorders(type);
},
// 获取订单列表的方法
async getOrders(type){
const res=await request({
url:"/my/orders/all", data:{
type}});
console.log(res);
},
handleTabsItemChange(e){
// 1 获取被点击的标题索引
const {
index}=e.detail;
// 2 修改源数组
let {
tabs}=this.data;
tabs.forEach((v,i)=>i===index?v.isActive=true:v.isActive=false);
// 3 赋值到data中
this.setData({
tabs
})
}
})
pages \ order \ index.js
haga clic en todos los pedidos -> transferir a la página de autorización -> haga clic en obtener autorización,
coloque la matriz en los datos para el siguiente paso de procesamiento
// pages/order/index.js
Page({
/**
* 页面的初始数据
*/
data: {
orders:[],
tabs:[
{
id: 0,
value:"全部",
isActive: true
},
{
id: 1,
value:"待付款",
isActive: false
},
{
id: 2,
value:"代发货",
isActive: false
},
{
id: 3,
value:"退款/退货",
isActive: false
}
]
},
onShow(options){
const token = wx.getStorageSync("token");
if (!token) {
wx.navigateTo({
url: '/pages/auth/index'
});
return;
}
// 1 获取当前的小程序的页面栈-数组长度最大是10页面
let pages = getCurrentPages();
// 2 数组中索引最大的页面就是当前页面
let currentPage=pages[pages.length-1];
console.log(currentPage.options);
// 3 获取url上的type参数
const {
type}=currentPage.options;
this.getorders(type);
},
// 获取订单列表的方法
async getOrders(type){
const res=await request({
url:"/my/orders/all", data:{
type}});
this.setData({
orders:res.orders
})
},
handleTabsItemChange(e){
// console.log(e);
// 1 获取被点击的标题索引
const {
index}=e.detail;
// 2 修改源数组
let {
tabs}=this.data;
tabs.forEach((v,i)=>i===index?v.isActive=true:v.isActive=false);
// 3 赋值到data中
this.setData({
tabs
})
}
})
Haga clic en todos los pedidos -> haga clic en AppData