npm install axios -S

目录

ajax.js   请求工具

/*
ajax请求函数模块
返回值: promise对象(异步返回的数据是: response.data)
*/
import axios from "axios";
import da from 'element-ui/src/locale/lang/da'
export default function ajax (url, data={}, type='GET',headers={}) { return new Promise(function (resolve, reject) {
// headers["Aauthorized"]= "xxxx"
const user_headers = {headers: headers};
// 执行异步ajax请求
let promise
if (type === 'GET')
{// 发送get请求
// 准备url query参数数据
let dataStr = '' //数据拼接字符串
Object.keys(data).forEach(key => {
dataStr += key + '=' + data[key] + '&'
})
if (dataStr !== '') {
dataStr = dataStr.substring(0, dataStr.lastIndexOf('&'))
url = url + '?' + dataStr
}
promise = axios.get(url=url,headers=user_headers)
} else if(type === 'POST')
{
// 发送POST请求
promise = axios.post(url=url, data=data,headers=user_headers)
}else //FORM
{
promise = axios.postForm(url=url,data=data,headers=headers)
}
promise.then(function (response) {
// 成功了调用resolve()
// resolve(response.data)
resolve(response)
}).catch(function (error) {
//失败了调用reject()
reject(error)
})
})
} /**
import {queryData} from '../api/index.js'
import ajax from './ajax'
export const queryData = () => ajax(url=`${BASE_URL}/sea/category/queryWithPage`,data={},type="POST",headers={"xx":"XXXXXXXX","sea":"SEAAAAAA"}) use:
methods: {
handleClick(row) {
console.log(row);
}, async findData(){
const result = await queryData()
console.log(result.data)
this.xx=result.data
return result.data
}
} */

index.js  定义API

 */
import ajax from './ajax'
const BASE_URL = '/api' export const queryData = () => ajax(url=`${BASE_URL}/sea/category/queryWithPage`,{},type="POST",headers={"my_header":"XXXXXXXX","sea":"SEAAAAAA"})

使用:

  import {queryData} from '../api/index.js'
export default {
name: 'About',
methods: {
handleClick(row) {
console.log(row);
}, async findData(){
const result = await queryData()
console.log(result.data)
this.xx=result.data
return result.data
}
}

:

axios utils axios.postForm的更多相关文章

  1. vue中使用axios与axios的请求响应拦截

    VUE中使用Axios axios的安装 npm install axios vue-axios axios在vue的配置与使用 在main.js中引入axios和vue-axios import a ...

  2. Axios 类似于for循环发送批量请求{:axios.all axios.spread}。

    Axios的请求都是异步的!不能用for循环遍历去批量发送请求 那如果我们需要类似与这样的请求怎么办呢 for(let i =0;i<array.length;i++){ axios.post( ...

  3. axios源码解析 - 请求方法的别名实现

    axios中的创建请求方式很多,比如axios(url),axios.get(url),axios.post(url),axios.delete(url),方便快捷的api设计让axios火得一塌糊涂 ...

  4. axios封装

    前言 作为出入vue的小萌新,我在写请求的时候,也是毫不犹豫写了ajax,结果肯定是不行的... Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2. ...

  5. AXIOS源代码重点难点分析

    摘要 vue使用axios进行http通讯,类似jquery/ajax的作用,类似angular http的作用,axios功能强大,使用方便,是一个优秀的http软件,本文旨在分享axios源代码重 ...

  6. Axios源码深度剖析 - 替代$.ajax,成为xhr的新霸主

    前戏 在正式开始axios讲解前,让我们先想想,如何对现有的$.ajax进行简单的封装,就可以直接使用原声Promise了? let axios = function(config){ return ...

  7. axios 封装

    来自:https://www.jianshu.com/p/68d81da4e1ad 侵删 import axios from 'axios' import qs from 'qs' let baseu ...

  8. 封装axios

    import axios from 'axios' // import store from '@/vuex/store.js' import router from '../router' impo ...

  9. vue项目实践-添加axios封装api请求

    安装 axios npm install axios --save 创建实例 (utils/fetch.js) axios 默认提交格式为:application/json 可使用 qs 模块(需要安 ...

  10. 使用axios post 提交数据,后台获取不到

    https://www.cnblogs.com/yiyi17/p/9409249.html(copy https://www.cnblogs.com/loveyaxin/p/8385694.html( ...

随机推荐

  1. ABAP 选择屏幕内的组件以及使用

    选择屏幕组件 主要记录了ABAP编程中选择屏幕常用的组件 选择框 范围选择框 radio单选 check选择 单行展现 配合radio和check使用较多 下拉框 自定义下拉框 按钮 文件框 文字帮助 ...

  2. sql-SQL Prompt

    本人用的是win10系统,这里也着重介绍win10系统的激活方式 激活方式: 1.首先系统HOSTS文件添加以下屏蔽网络 127.0.0.1 red-gate.com 127.0.0.1 www.re ...

  3. 【Docker】清理磁盘占用

    查看磁盘空间占用 # /var/lib/docker # du -sh * 快速清理 简单清除不使用的镜像及容器 docker system prune docker system prune -a ...

  4. usbip:(二)从linux内核了解usb

    一.前言 1.首先了解一下EHCI.UHCI和OHCI. 从硬件上来说,usb 设备要想工作,除了外设本身,必须依赖于 usb host controller.一般来说,一个电脑里有一个 usb ho ...

  5. HCIP-进阶实验02-ISIS协议部署

    进阶实验02-ISIS协议部署 1 实验需求 设备 接口 IP地址 备注 R1 G0/0/0 10.1.123.1/24 R2 G0/0/0 10.1.123.2/24 G0/0/1 10.1.24. ...

  6. Java-AES256加密Util

    1 public class AES256Util { 2 3 /** 4 * 密钥, 256位32个字节 5 */ 6 public static final String DEFAULT_SECR ...

  7. HTML复习(18.图片样式)

    重点 掌握图片样式属性(大小.边框.对齐)了解float属性 图片大小在CSS中,我们也是使用width和height这2个属性来定义图片的大小(也就是宽度和高度).在实际开发中,如果你需要多大的图片 ...

  8. python中列表,字典,字符串常用操作

    1. 列表操作 分类 关键字 / 函数 / 方法 说明 增加 列表.append(值) 在末尾追加值   列表.insert(索引, 值) 在指定位置插入值, 超过索引会追加值   列表.extend ...

  9. 算法题:消除字符串中全部的b和连续的ac

    最近碰到了一道面试题,虽然不难但是临试没想出好的解法,记录下来以作分享. 题目:消除字符串中全部的b和连续的ac 用例: 'aabbc' -> 'a' 'aaabbbccc' -> '' ...

  10. mac 安装 nginx 流程,并解决前端跨域问题

    mac 安装 nginx 流程 首先mac安装brew包管理工具: /bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN ...