npm install axios

创建文件夹api/index.js

import axios from 'axios';

let http = axios.create({
baseURL: '',
changeOrigin: true,
withCredentials: true,
headers: {
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
},
transformRequest: [function (data) {
let newData = '';
for (let k in data) {
if (data.hasOwnProperty(k) === true) {
newData += encodeURIComponent(k) + '=' + encodeURIComponent(data[k]) + '&';
}
}
return newData;
}]
}); function apiAxios(method, url, params, response) {
http({
method: method,
url: url,
data: method === 'POST' || method === 'PUT' ? params : null,
params: method === 'GET' || method === 'DELETE' ? params : null,
}).then(function (res) {
response(res);
}).catch(function (err) {
response(err);
})
} export default {
get: function (url, params, response) {
return apiAxios('GET', url, params, response)
},
post: function (url, params, response) {
return apiAxios('POST', url, params, response)
},
put: function (url, params, response) {
return apiAxios('PUT', url, params, response)
},
delete: function (url, params, response) {
return apiAxios('DELETE', url, params, response)
}
}

  

main.js

import Api from './api/index.js';
Vue.prototype.$api = Api;

  

调用

 this.$api.get('/apis/index.php?act=login', {
"act": "login"
}, response => {
this.msg=response.data+'1';
},error => {
this.msg='error';
} );

  

axios使用方法的更多相关文章

  1. 使用Typescript重构axios(三十)——添加axios.getUri方法

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  2. 使用Typescript重构axios(三十一)——添加axios.all和axios.spread方法

    0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三) ...

  3. Vue使用axios post方法发送json数据报415Unsupported Media Type

    1.Vue使用axios post方法发送json数据 <template> <el-aside> <el-form ref="form" :mode ...

  4. vue axios使用方法

    首先安装axios: cnpm install axios -save 安装成功后,在main.js页面引用: import axios from 'axios' import Qs from 'qs ...

  5. vue全局使用axios的方法

    在vue项目开发中,我们使用axios的二次封装,很多人一开始使用axios的方式,会当成vue-resoure的使用方式来用,即在主入口文件引入import VueResource from 'vu ...

  6. axios请求方法封装.

    axios的使用上一般封装好对应的方法,ES6导出,直接调用,消息通知使用了ElementUI的Message组件. 这是一个封装了axios的Rest风格的工具类,包扩常用的POST,GET,PUT ...

  7. axios+post方法提交formdata步骤详解

    遇到的问题 :怎么看自己发送的格式和后台发送的格式 参考 http://www.php.cn/js-tutorial-396014.html https://blog.csdn.net/qq73705 ...

  8. vue axios数据请求get、post方法的使用

    我们常用的有get方法以及post方法,下面简单的介绍一下这两种请求方法 vue中使用axios方法我们先安装axios这个方法 npm install --save axios 安装之后采用按需引入 ...

  9. axios源码入口以及公用方法

    axios学习笔记(公用方法) 源码地址 找到入口文件 axios/lib/axios.js var utils = require('./utils'); var bind = require('. ...

随机推荐

  1. CDR中怎么绘制一个漂亮的球衣?

    cdr中怎么绘制一个漂亮的球衣?想要绘制一个漂亮的球衣,该怎么绘制呢?下面我们就来看看cdr绘制漂亮的球衣的教程,需要的朋友可以参考下: 1.画一个长方形,增加节点,移动节点,变形成如图 2.直线变曲 ...

  2. Pyhton学习——Day28

    #上下文协议:文件操作时使用with执行# with open('a.txt','w',encoding='utf-8') as f1:# with语句,为了让一个对象兼容with语句,必须在这个对象 ...

  3. 如何降低死循环的 CPU 占用

    有的时候程序中需要使用死循环,比如消息监听就要用一个死循环,直到受到消息请求关闭才可能跳出循环. 一个 while(true){} 的循环中即便循环体是空的,也会占用几乎一整个 CPU 核心.为了降低 ...

  4. node工具是是什么东西

    Node到底是个啥? Node是一个服务器端JavaScript解释器,可是真的以为JavaScript不错的同学学习Node就能轻松拿下,那么你就错了,总结:水深不深我还不知道,不过确实不浅 最近写 ...

  5. codevs 3945 完美拓印 (KMP)

    题目大意:给你一个神奇的印章,他左右下三个面都是直的,上面是凸凹不平的面(凸凹都平行于别的面).然后给你一个轮廓线,如果一个面能与轮廓线完全重合,可以把印章的这个沿着轮廓线拓印,求所有的拓印方案. 把 ...

  6. java实现组合数_n!_杨辉三角_组合数递推公式_回文数_汉诺塔问题

    一,使用计算机计算组合数 1,设计思想 (1)使用组合数公式利用n!来计算Cn^k=n!/k!(n-k)!用递推计算阶乘 (2)使用递推的方法用杨辉三角计算Cn+1^k=Cn^k-1+Cn^k 通过数 ...

  7. Vue.js 笔记之 img src

    固定路径(原始html) index.html如下,其中,引号""里面就是图片的路径地址 ```<img src="./assets/1.png"> ...

  8. python--(爬虫-re模块)

    python--(爬虫-re模块) re模块四大核心功能: 1.findall 查找所有,返回list import re lst = re.findall("m", " ...

  9. 20130912.Windows下常用命令的使用(不断更新)

    Win+R================================ cmd => 命令行 lpksetup => 弹出安装或者卸载Windows显示语言 ipconfig => ...

  10. 高级聚合函数rollup(),cube(),grouping sets()

       rollup(),cube(),grouping sets()   上面这几个函数,是对group by分组功能做的功能扩展. a.rollup()   功能:在原结果基础上追加一行总合计记录 ...