axios utils axios.postForm
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的更多相关文章
- vue中使用axios与axios的请求响应拦截
VUE中使用Axios axios的安装 npm install axios vue-axios axios在vue的配置与使用 在main.js中引入axios和vue-axios import a ...
- Axios 类似于for循环发送批量请求{:axios.all axios.spread}。
Axios的请求都是异步的!不能用for循环遍历去批量发送请求 那如果我们需要类似与这样的请求怎么办呢 for(let i =0;i<array.length;i++){ axios.post( ...
- axios源码解析 - 请求方法的别名实现
axios中的创建请求方式很多,比如axios(url),axios.get(url),axios.post(url),axios.delete(url),方便快捷的api设计让axios火得一塌糊涂 ...
- axios封装
前言 作为出入vue的小萌新,我在写请求的时候,也是毫不犹豫写了ajax,结果肯定是不行的... Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2. ...
- AXIOS源代码重点难点分析
摘要 vue使用axios进行http通讯,类似jquery/ajax的作用,类似angular http的作用,axios功能强大,使用方便,是一个优秀的http软件,本文旨在分享axios源代码重 ...
- Axios源码深度剖析 - 替代$.ajax,成为xhr的新霸主
前戏 在正式开始axios讲解前,让我们先想想,如何对现有的$.ajax进行简单的封装,就可以直接使用原声Promise了? let axios = function(config){ return ...
- axios 封装
来自:https://www.jianshu.com/p/68d81da4e1ad 侵删 import axios from 'axios' import qs from 'qs' let baseu ...
- 封装axios
import axios from 'axios' // import store from '@/vuex/store.js' import router from '../router' impo ...
- vue项目实践-添加axios封装api请求
安装 axios npm install axios --save 创建实例 (utils/fetch.js) axios 默认提交格式为:application/json 可使用 qs 模块(需要安 ...
- 使用axios post 提交数据,后台获取不到
https://www.cnblogs.com/yiyi17/p/9409249.html(copy https://www.cnblogs.com/loveyaxin/p/8385694.html( ...
随机推荐
- iOS开发 WKWebView实现JS交互
需求:利用webView加载H5页面,并实现点击H5页面的按钮触发事件,事件是调用OC的方法.简单说就是JS调用OC的方法,这里我们选择的是WKWebView,至于为什么不用UIWebView,自行百 ...
- C#新语法
C#新语法 NET6新特性以及C#新语法 1.顶级语句(C#9.0) (1):直接在C#文件中直接编写入口方法的代码,不用类,不用Main.经典写法仍然支持,反编译可以查看到,编译器依旧为我们生成了一 ...
- docker打包nginx
nginx镜像 localtime为/etc/localtime文件 给容器限定日志打印时间为北京时间 FROM nginx:stable-alpine MAINTAINER geyanan gey ...
- NifytGUI——ListBox控件
ListBox控件的用法,创建一个xml,代码如下: <?xml version="1.0" encoding="UTF-8" standalone=&q ...
- axios上传excal方法
方法一(适合传文件且带参数的方法) HTML内容 <a href="javascript:;" class="select-file"> <i ...
- maven处理jar包冲突
一.起因 在使用maven构建项目的时候,偶尔会遇上类似如下错误: (1)java.io.IOException: invalid constant type: 15 (2)java.lang.NoS ...
- [2009年NOIP普及组] 分数线划定
世博会志愿者的选拔工作正在A市如火如荼的进行.为了选拔最合适的人才,A市对所有报名的选手进行了笔试,笔试分数达到面试分数线的选手方可进入面试.面试分数线根据计划录取人数的150%划定,即如果计划录取m ...
- 开发Unity3D空战类插件 战机HUD系统
Fighter HUD System 当您使用Unity3D来开发飞行模拟或者空战类游戏时,这款Fighter HUD Sytem插件将会非常的适合用来充当您战机的HUD系统. 特点 此HUD系统的安 ...
- 前端自动化测试框架Cypress环境搭建
1. 下载安装node.js(之前的随笔里写过安装nodejs具体步骤这里不过多介绍了) 下载地址:https://nodejs.org/en/ 2.安装路径(这是安装完成nodejs的路径) 3. ...
- mac下eclipse关联svn插件
由于新冠状病毒的疫情这一周都需要在家办公了,家里只有一个mac之前只是娱乐工具,今天不得不用它撸代码,无奈重新安装各种环境,mac和windows的环境安装区别还是很大的,今天差点折磨死我,尤其是在e ...