09事件传递参数-封装网络请求api get和post合并整合在一起

简介: 09事件传递参数-封装网络请求api get和post合并整合在一起

1==>通过点击事件进行传递参数


<view  bindtap="goEdution" data-index="5">西南大学</view>
  <view  bindtap="goEdution" data-index="6">北京师范</view>
  <view  bindtap="goEdution" data-index="7">成都大学</view>
  // 传递的参数
  goEdution(e) {
    console.log("传递过来的参数", e.currentTarget.dataset['index']) //5  6  7
  },
  传递参数时  使用data-开头就好了
  传递的参数通过dataset来接受


2===》


 封装网络请求


 在page同级目录下创建 serverhttpapi文件夹 ==》创建httpapi.js文件


export default function mynetwork(options){
  console.log("你调用了我");
  wx.request({
    url: options.url, //请求的地址
    method:options.method||"get",//方式
    data:options.data||{},//参数
    // 成功的回调
    success:function(res){
      console.log(res)
    },
    fail:function(err){
      console.log("失败的调用")
    }
  })
}


由于不能够直接在这里打印出来  所以使用promise  注意返回值哦 如下


export default function mynetwork(options){
  return new Promise((resolve,reject)=>{
    wx.request({
      url: options.url, //请求的地址
      method: options.method || "get",//方式
      data: options.data || {},//参数
      // 成功的回调
      success: function (res) {
       resolve(res)
      },
      fail: function (err) {
       reject(err)
      }
    })
  })
}


在某个js页面引入


import mynetwork from "../../serverhttpapi/httpapi.js"
Page({
})


调用


onLoad: function (options) {
    mynetwork({
      url: "https://edu.51cto.com/center/seckill/index/get-seckill-data",
      method: "get",
    }).then(res=>{
      console.log("封装",res) //输出数据
    }).catch(err=>{
      console.log(err)
    })
  }
相关文章
|
1月前
|
缓存 前端开发 API
API接口封装系列
API(Application Programming Interface)接口封装是将系统内部的功能封装成可复用的程序接口并向外部提供,以便其他系统调用和使用这些功能,通过这种方式实现系统之间的通信和协作。下面将介绍API接口封装的一些关键步骤和注意事项。
|
1月前
|
人工智能 缓存 API
谷歌发布MediaPipe LLM Inference API,28亿参数模型本地跑
【2月更文挑战第24天】谷歌发布MediaPipe LLM Inference API,28亿参数模型本地跑
144 3
谷歌发布MediaPipe LLM Inference API,28亿参数模型本地跑
|
29天前
|
存储 算法 关系型数据库
实时计算 Flink版产品使用合集之在Flink Stream API中,可以在任务启动时初始化一些静态的参数并将其存储在内存中吗
实时计算Flink版作为一种强大的流处理和批处理统一的计算框架,广泛应用于各种需要实时数据处理和分析的场景。实时计算Flink版通常结合SQL接口、DataStream API、以及与上下游数据源和存储系统的丰富连接器,提供了一套全面的解决方案,以应对各种实时计算需求。其低延迟、高吞吐、容错性强的特点,使其成为众多企业和组织实时数据处理首选的技术平台。以下是实时计算Flink版的一些典型使用合集。
95 4
|
4天前
|
JavaScript 前端开发 测试技术
【vue实战项目】通用管理系统:api封装、404页
【vue实战项目】通用管理系统:api封装、404页
15 3
|
1月前
|
存储 算法 Windows
课程视频|R语言bnlearn包:贝叶斯网络的构造及参数学习的原理和实例(下)
课程视频|R语言bnlearn包:贝叶斯网络的构造及参数学习的原理和实例
|
1月前
|
算法 数据可视化 数据挖掘
课程视频|R语言bnlearn包:贝叶斯网络的构造及参数学习的原理和实例(上)
课程视频|R语言bnlearn包:贝叶斯网络的构造及参数学习的原理和实例
|
1月前
|
网络协议 Linux API
Linux网络编程:shutdown() 与 close() 函数详解:剖析 shutdown()、close() 函数的实现原理、参数说明和使用技巧
Linux网络编程:shutdown() 与 close() 函数详解:剖析 shutdown()、close() 函数的实现原理、参数说明和使用技巧
171 0
YOLOv8打印模型结构配置信息并查看网络模型详细参数:参数量、计算量(GFLOPS)
YOLOv8打印模型结构配置信息并查看网络模型详细参数:参数量、计算量(GFLOPS)
|
10天前
|
前端开发 API
|
17天前
|
网络协议 网络安全
在Windos Server 2016 版本配置网络参数和接入工作组网络
在Windos Server 2016 版本配置网络参数和接入工作组网络