在我们做小程序时,数据请求数据请求是避免不了的,然而我们用官方自带的请求方式,会给我们带来很多重复的工作,所以我就借鉴大神们的博客,写了一个简单的请求方式。

1.首先我们在utils中新建一个api.js文件,将一下代码粘贴进去:

const host ='http://localhost:8081/activity/web/loginFrom/';//这个是你们的接口域名
const api = { getClickNum: host +'reading'//接口进行拼接 } module.exports = api;

2.在app.js中写入一下的方法:

fetch(url, data, callback) {

    wx.request({

      url,

      data: data,

      header: {

        'Content-Type': 'application/json'

      },

      success(res) {

        callback(null, res.data);

      },

      fail(e) {

        callback(e);

      }

    })

  },

3.将api.js引入调用接口的js文件中

//引入接口api文件
import API from "../../utils/api.js";
 onLoad (){
    app.fetch(API.getClickNum,{},(err,data) => {
       console.log(data)
    })
  },

小程序请求接口统一封装到一个js文件中的更多相关文章

  1. 基于小程序请求接口 wx.request 封装的类 axios 请求

    基于小程序请求接口 wx.request 封装的类 axios 请求 Introduction wx.request 的配置.axios 的调用方式 源码戳我 feature 支持 wx.reques ...

  2. 在VS中让一个JS文件智能提示另一个JS文件中的成员

    “在VS中如何让一个JS文件智能提示另一个JS文件中的成员” 有时候会有这种情况:当我的一个Web页面引用了两个JS文件(假如分别叫common.js和JScript1.js),如果JScript1. ...

  3. 在VS中让一个JS文件智能提示另一个JS文件中的成员2--具体引用

    我们知道,在html中,利用<script language="javascript" type="text/javascript" src=" ...

  4. 小程序 请求Promise简单封装

    最近做小程序在调用后台接口的时候感觉总写很长一串,很冗杂.非常想念vue中promise封装的写法,于是自己初步封装了一下. 1.url 接口地址 2.headers请求头 3. params 请求参 ...

  5. Visual Studio中让一个JS文件智能提示另一个JS文件中的成员

    当一个Web页面引用了两个JS文件(假如分别叫common.js和JScript1.js),如果JScript1.js中需要调用大量的common.js中的方法,这时候在JScript1.js中智能提 ...

  6. Highcharts教程--把js代码从html中抽离出来,放到单独的一个js文件中。由html页面调用

    1.html页面写法 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  7. js封装,一个JS文件引用多个JS文件

    (function() { //加载   varobj =  {};   /**    * 动态加载脚本函数    * @param url 要加载的脚本路径    * @param callback ...

  8. 微信小程序HTTP接口请求封装

    1.方法封装(新建文件夹util,工具文件,在文件夹下创建request.js文件,用于对方法封装)request.js: var app = getApp(); //项目URL相同部分,减轻代码量, ...

  9. 微信小程序API接口封装

    @ 目录 一,让我们看一下项目目录 二,让我们熟悉一下这三个文件目的(文件名你看着办) 三,页面js中如何使用 今天的API的封装,我们拿WX小程序开发中,对它的API (wx.request)对这个 ...

随机推荐

  1. node lesson6

    https://nodejs.org/docs/latest/api/process.html#process_process_argv https://github.com/alsotang/nod ...

  2. 各种图示的介绍及绘制(boxplot、stem)

    1. 箱线图(boxplot) 也叫作箱形图: 一种用作显示一组数据分散情况资料的统计图.因形状如箱子而得名.在各种领域也经常被使用,常见于品质管理. 主要包含六个数据节点,将一组数据从大到小排列,分 ...

  3. 将 WPF、UWP 以及其他各种类型的旧 csproj 迁移成基于 Microsoft.NET.Sdk 的新 csproj

    原文 将 WPF.UWP 以及其他各种类型的旧 csproj 迁移成基于 Microsoft.NET.Sdk 的新 csproj 写过 .NET Standard 类库或者 .NET Core 程序的 ...

  4. WPF图片浏览器(显示大图、小图等)

    原文:WPF图片浏览器(显示大图.小图等) 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/wangshubo1989/article/details ...

  5. 【Linux计划】XSI IPC

    三种IPC这就是所谓的XSI IPC,每间: 消息队列 信号量 共享存储器 以下分别介绍三种IPC的使用方法. 1.消息队列 消息队列是消息的链接表,具有例如以下函数接口: msgget:创建一个新队 ...

  6. wordpress如何判断手机、平板还是PC并显示对应的内容-Mobile Detect

    wordpress如何判断是手机.平板还是PC访问,并针对性的显示特定的内容?Mobile Detect 这个轻量级PHP 类库能够很好的实现这个功能.而且Mobile Detect也有wordpre ...

  7. 去掉 Windows 中控件的虚线框(当当 element == QStyle::PE_FrameFocusRect 时,直接返回,不绘制虚线框)

    在 Windows 中,控件得到焦点的时候,会显示一个虚线框,很多时候觉得不好看,通过自定义 QProxyStyle 就可以把这个虚线框去掉. 1 2 3 4 5 6 7 8 9 10 11 12 1 ...

  8. WPF 4 目录树型显示

    原文:WPF 4 目录树型显示      本篇将通过WPF4 制作简单的目录树型结构显示实例,完成本篇内容我们将作出下图所示的应用程序.      从图中我们可以看到程序主要分为两部分:左边显示本地驱 ...

  9. 【msdn wpf forum翻译】如何在wpf程序(程序激活时)中捕获所有的键盘输入,而不管哪个元素获得焦点?

    原文:[msdn wpf forum翻译]如何在wpf程序(程序激活时)中捕获所有的键盘输入,而不管哪个元素获得焦点? 原文链接:http://social.msdn.microsoft.com/Fo ...

  10. OpenGL红宝书附带源码编译问题集锦

    以下所有源码均在win7,VS2008环境下测试.下不再赘述. 1.所有的.c扩展名请改为.cpp扩展名,以避免不可预测的错误. 想知道会出现什么不可预测的错误..请见我上一篇Blog... 2.如果 ...