Guoguo-notes
主页
  • 常用笔记
  • 飞码篇
  • Java
  • React笔记
  • 袁果锅生态
GitHub
主页
  • 常用笔记
  • 飞码篇
  • Java
  • React笔记
  • 袁果锅生态
GitHub
  • 飞码篇

    • CSS--common.md
    • ES6.md
    • Git提交.md
    • Js获取当前时间的方法.md
    • Uni-App笔记.md
    • Uni-app API.md
    • Uniapp-插件.md
    • VueX 笔记.md
    • js函数封装.md
    • js常规.md
    • uView基本使用.md
    • uniapp 引入组件库.md
    • 常用正则表达式.md
    • 界面类.md
    • 笔记.md
    • 组件封装.md
    • 编程逻辑整理.md
    • 调用接口.md

调用接口

/** 全宗机构关联列表的分页  yxd **/
export function getFondsInnerPageData(id, data) {
  return request({
    url: `/fonds/selectUserListByDeptld/${id}`,
    method: 'post',
    params: data
  })
}

1.调用接口的方法

请求数据逻辑

我们每次点击都会向后台请求数据,然后后台返回的数据来覆盖我们本有的数据,从而达到页面为最新数据的效果。

如果在刚开始时,请求所有数据,再利用前端来进行筛选的话,可能会出现 空缺 或者 换页 有问题的状况

定义接口

// 我的订单
GetScenicOrderList(params) {return req.POST('Scenic/GetScenicOrderList', params)},

页面中进行引用这个接口

import {GetScenicOrderList} from "@/api/scenic.js";

methods 中定义方法请求这个接口,并将这个接口放到自己的变量中

orderList() {
    this.loading = true;
    GetScenicOrderList({
        data: {
            Status: -1,
        }
    }).then(res => {
        this.OrderList = res.OrderList;
        if (res.resultcode == 0) {
            this.OrderList = [];
        }
        this.loading = false;
    })
},

在 onShow 中调用一下

	onShow(){
		this.page = 1;// 为防止有翻页的页面,这个值为翻页定位值
		this.orderList();
	},

2. 跳转页面时传值

父页面在调用的时候,将页面中通过点击事件来调用页面

<view class="goods align-center" @click="goDetail(item)"> </view>

在调用页面的时候,将这个数据保存到全局变量中,然后进行页面的跳转

注意 本次调用数据因为涉及到筛选, 所以直接传的值为 item 这个经过筛选后得到的item值,

		goDetail(item) {
			app.globalData.optionsItem = item;
			uni.navigateTo({
				url: '/pages/order/detail?ORDERID=' + item.ID
			})
		},

子组件中 ,页面已经完成了跳转,现在子组件需要接收数据

通过在 onload 中进行接收数据 ,并且保存到子组件定义的变量orderItem中,

Now , we can 对这个变量进行数据渲染了

	onLoad(e) {
		this.ORDERID = e.ORDERID;
		this.orderItem = app.globalData.optionsItem;
		console.log("ddddddd",this.orderItem);
	},
Edit this page
Last Updated:
Contributors: 袁果锅
Prev
编程逻辑整理.md