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

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. 全栈工程师之路(二)—— JavaScript(网页前端脚本语言)

    javascript 是可以运行在网页前端的脚本语言,可以基于 html 之上实现更丰富的交互(网页内容的交互显示).异步回调.多线程.定时器.动画等. hello_world.html <ht ...

  2. Android 悬浮窗权限校验

    原文:Android 悬浮窗权限校验 悬浮窗权限: <uses-permission android:name="android.permission.SYSTEM_ALERT_WIN ...

  3. echarts学习(上)

    echarts 学习之路 学习思路 初识echarts 编写自己的echarts图表 根据需求编写工作中的echarts图表[进阶篇] github地址:https://github.com/liso ...

  4. Chrome扩展,应用开发学习笔记之2---恶搞百度一下

    Chrome扩展,应用开发学习笔记之2 恶搞百度一下 前面我们介绍了一个最简单的chrome扩展时钟,如今我来介绍一下一个恶搞百度一下的chrome扩展程序. 前面说过,manifest.json文件 ...

  5. 使用bcc32做在windowXP上qt3.2.1编译环境的配置

    1.安装borland C++编译器,编译器文件所在目录下的文件如下: 其中bcc32.cfg和ilink32.cfg文件是自己加进去的,bcc32.cfg内容是-I"C:\Borland\ ...

  6. thinkphp 删除所有缓存 Rumtime 以及 Html 静态缓存

    <?php /** * This is not a free software, All Copyright @F.Z.B * Date: 14-8-12 下午4:08 * File: Cach ...

  7. Windows PowerShell 集成脚本环境 (ISE)

    应用场景 有时会遇到一些这样的报错 Exception calling "SetData" with "2" argument(s): "Type ' ...

  8. XF 表视图添加和删除行

    using System;using Xamarin.Forms;using Xamarin.Forms.Xaml; [assembly: XamlCompilation (XamlCompilati ...

  9. jquery对象及页面加载完成写法

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  10. HTTP协议学习 - 9 Method Definitions

    # 前言 官方文档简略翻译.9 不是代表第九篇,而是在 RFC2616 中是第九篇.重要加粗,龟速翻译. # Method 9.3 GET The GET method means retrieve ...