前言

微信小程序不存在ajax,那么它是如何实现数据请求功能的呢?在微信中提供了API的调用wx.request(OBJECT),这个是很不错的。下面就讲一下如何请求数据,简单到不行。

wx.request

看文档时,提供了示例模板如下:

  1. wx.request({
  2. url: 'test.php', //仅为示例,并非真实的接口地址
  3. data: {
  4. x: '' ,
  5. y: ''
  6. },
  7. header: {
  8. 'content-type': 'application/json' // 默认值
  9. },
  10. success: function(res) {
  11. console.log(res.data)
  12. }
  13. })

如何调取数据这是个难题,但是要模拟调用是有可能的。因为有个网址:https://easy-mock.com/,提供了模拟数据的请求。那么我们先来模拟一下数据吧,到时,复制链接给模板中的url即可。


如图登录官网,登录,接着点击箭头,进入下一页面。

点击创建接口。

更新数据,创建属于自己的数据即可。

一可预览效果,复制链接到url模板中。

接着我们打开微信小程序的开发工具,在界面中添加按钮请求即可。

  1. <button type='primary' bindtap='send'>请求数据</button>

接着在js文件中添加事件。

  1. //send
  2. send: function(){
  3. wx.request({
  4. url: '复制的链接', //仅为示例,并非真实的接口地址
  5. data: {
  6. x: '',
  7. y: ''
  8. },
  9. header: {
  10. 'content-type': 'application/json' // 默认值
  11. },
  12. success: function (res) {
  13. console.log(res.data)
  14. }
  15. })
  16. }

点击按钮如果出现下面的错误,那是因为要到详情按钮中,给个地方打个勾即可。

找到下方打钩即可。

点击按钮,即可查看,请求数据效果出现了。

结语

  • 你完成了吗?是不是,很容易呢?是不是很简单呢?

微信小程序如何调用API实现数据请求-wx.request()的更多相关文章

  1. 微信小程序填坑之路其一:wx.request发送与服务端接受

    一.序言 应公司要求要求,要用小程序开发一个信息录入系统.没办法只能听话来填坑. 先介绍一下环境:客户端——小程序:服务端——java:数据库——mysql:服务器——centos7 需求:客户端输入 ...

  2. 微信小程序的ajax数据请求wx.request

    微信小程序的ajax数据请求,很多同学找不到api在哪个位置,这里单独把小程序的ajax请求给列出来,微信小程序的请求就是wx.request这个api,wx.request(一些对象参数),微信小程 ...

  3. 微信小程序的Web API接口设计及常见接口实现

    微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,通过小程序的请求Web API 平台获取JSON数据后,可以在小程序界面上进行数据的动态展示.在数据的关键 一环中,我们 ...

  4. 微信小程序前端与myeclipse的数据交换过程(SSH)

    这是我个人探究微信小程序前端与后端之间的数据交换的过程,再结合个人所学的SSH框架, 编程工具用myEclipse2014工具.当然,前提是后台的项目要部署到tomcat服务器上才行, 然后总结了从后 ...

  5. 微信小程序添加外部地图服务数据

    先上效果: 缘起 使用微信小程序做地图相关功能的时候,有个需求是需要接入自己发布的地图服务.查看微信小程序地图组件文档,发现它对地图相关的支持很少,只有一些基础功能,比如添加点.线.面.气泡和一些常规 ...

  6. 微信小程序页面调用自定义组件内的事件

    微信小程序页面调用自定义组件内的事件 page page.json { "usingComponents": { "my-component": ". ...

  7. WeChat-SmallProgram:微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading 等.如果需要同步处理,可以使用如下方法: 提示:Async ...

  8. 微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading等.如果需要同步处理,可以使用如下方法: 注意: Async ...

  9. 整合微信小程序的Web API接口层的架构设计

    在我前面有很多篇随笔介绍了Web API 接口层的架构设计,以及对微信公众号.企业号.小程序等模块的分类划分.例如在<C#开发微信门户及应用(43)--微信各个项目模块的定义和相互关系>介 ...

随机推荐

  1. MySQL InnoDB引擎B+树索引简单整理说明

    本文出处:http://www.cnblogs.com/wy123/p/7211742.html (保留出处并非什么原创作品权利,本人拙作还远远达不到,仅仅是为了链接到原文,因为后续对可能存在的一些错 ...

  2. 关于https不支持http的解决方案

    由于在写md的时候截图是用的微博的图床,上传到github才发现不让在其他网站使用,所有本文只有一张图片. 刚才进行网站测试的时候,微博秀这个插件不能显示出来,一直是空白, 然后我把本地域名改成了12 ...

  3. (转)2018CRM系统最新排行榜

    https://www.jianshu.com/p/718cc29de91f 2018CRM系统最新排行榜 深谷幽兰呼 关注 2018.09.04 10:22 字数 1524 阅读 3182评论 0喜 ...

  4. MFC笔记3

    1. C6有默认的提示代码功能,但是其默认的快捷键是Ctrl + Space,这一般情况下是切换输入法快捷键,所以,只需重新设置一下快捷键就可以实现提示代码功能,具体设置位置如下: 工具(T) -&g ...

  5. spring okhttp3

    准备工作 在pom.xml文件中增加以下依赖 <dependency> <groupId>com.squareup.okhttp3</groupId> <ar ...

  6. 【mac环境】终端配色 & 配置使用ll命令

    1.MAC OS X 命令终端的颜色显示 打开 terminal 会发现 ls 和 grep 后的结果是没有色彩的,这时候可以这么干: 用 vim 打开文件 ~/.bash_profile,然后把下边 ...

  7. Django的rest_framework认证组件之全局设置源码解析

    前言: 在我的上一篇博客我介绍了一下单独为某条url设置认证,但是如果我们想对所有的url设置认证,该怎么做呢?我们这篇博客就是给大家介绍一下在Rest_framework中如何实现全局的设置认证组件 ...

  8. python的序列类

    1,我们常见的数据结构有哪些是序列类 序列类型的分类: ①  容器序列:list,tuple,deque(可以防止任意的类型的容器) ②  扁平序列:str,bytes,bytearray,array ...

  9. centos 安装解压工作

    解压工具: yum install ark 编辑器: yum install gedit

  10. Apache Beam是什么?

    Apache Beam 的前世今生 1月10日,Apache软件基金会宣布,Apache Beam成功孵化,成为该基金会的一个新的顶级项目,基于Apache V2许可证开源. 2003年,谷歌发布了著 ...