02 axios
request.js
import axios from 'axios'
const config = require('@/config') const instance = axios.create({
baseURL: config.baseUrl,
timeout: 15 * 1000 // 15s timeout
}) instance.interceptors.request.use(
function(config) {
// 在发送请求之前做些什么
return config
},
function(error) {
// 对请求错误做些什么
return Promise.reject(error)
}
) // 添加响应拦截器
instance.interceptors.response.use(
function(response) {
// 对响应数据做点什么
const data = response.data
if (data.resCode !== 0) {
return Promise.reject(data) // 人为走catch代码
}
return response.data
},
function(error) {
// 对响应错误做点什么
return Promise.reject(error)
}
) export function get(url, params) {
return instance.get(url, {
params: params
})
}
export function post(url, params) {
instance.defaults.headers.post['Content-Type'] = 'application/json'
return instance.post(url, JSON.stringify(params))
}
news.js
import { get, post } from './request' function getNewsList(params) {
return get('/newsList', params)
}
function updateList(params) {
return post('/updateNewsList', params)
}
export default {
getNewsList,
updateList
}
user.js
import { post } from './request' function getSms(params) {
return post('/getSms/', params)
}
function register(params) {
return post('/register/', params)
} function login(params) {
return post('/login/', params)
}
export default {
getSms,
register,
login
}
index.js
// 实现自动化导入import。
const context = require.context('./', false, /\.js$/)
console.log(context.keys()) // ["./index.js", "./news.js", "./request.js", "./user.js"]
let res = {}
context.keys().forEach(filePath => {
if (['./index.js', './request.js'].includes(filePath)) return
const value = context(filePath).default
res = { ...res, ...value }
}) export default res
main.js
import api from './network'
Vue.prototype.$api = api
02 axios的更多相关文章
- 【手摸手,带你搭建前后端分离商城系统】02 VUE-CLI 脚手架生成基本项目,axios配置请求、解决跨域问题
[手摸手,带你搭建前后端分离商城系统]02 VUE-CLI 脚手架生成基本项目,axios配置请求.解决跨域问题. 回顾一下上一节我们学习到的内容.已经将一个 usm_admin 后台用户 表的基本增 ...
- 02 . 处理axios的三个问题 :设置基路径/axios挂载到vue原型/请求时自动携带token
//使用API时必须在请求头中使用 Authorization 字段提供 token 令牌 import axios from 'axios' // 处理axios的三个问题 // 处理一:基路径 a ...
- 02 Vue之vue对象属性功能&axios数据请求实现
1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...
- 06-vue项目02:vuex、Mutation、Action、ElementUI、axios
1.Vuex 1.为什么使用VueX data从最上面的组件,一层层往下传值,一层层的验证 Vue单向数据流 “中央空调“,代理 VueX 解决数据 传值.. 2.Vuex介绍与安装 (1)Vuex官 ...
- python接收axios的post请求,并处理后返回数据
公司的python工程师不会js和python数据交互,所以我就去试了一下. 首先安装python,django框架和django-cors-headers. python官网下载,按提示操作,记住最 ...
- 二: vue的属性及功能,axios
一: 过滤器 1. 定义: 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 2.使用vue.filter()进行全局定义 ...
- 搭建vue脚手架,包含Axios、qs、Element-UI、mock等插件的安装配置
1.安装node.vue这些最基础最简单的安装的就一一省略过. 1.1 axios 安装 1.2安装 Element-Ui 插件 1.3 安装 qs 1.4 安装 Mock 2.新建一个vue工程, ...
- Axios & fetch api & Promise & POST
Axios & fetch api & Promise & POST https://github.com/axios/axios https://appdividend.co ...
- 【转】axios全攻略
随着 vuejs 作者尤雨溪发布消息,不再继续维护vue-resource,并推荐大家使用 axios 开始,axios 被越来越多的人所了解.本来想在网上找找详细攻略,突然发现,axios 的官方文 ...
随机推荐
- Qt 中十六进制字节流转换为Base64编码
在Qt中,在网络通信时,有时需要将16进制字节流转换为Base64编码传输,在Qt的QByteArray类中,提供了与Base64转换的接口: //16进制字节流转为Base64 QByteArray ...
- 比PS还好用!Python 20行代码批量抠图
你是否曾经想将某张照片中的人物抠出来,然后拼接到其他图片上去,从而可以即使你在天涯海角,我也可以到此一游? 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语法过后,不知道在 ...
- 用 Python 可以实现侧脸转正脸?我也要试一下!
作者 | 李秋键 责编 | Carol 封图 | CSDN 下载自视觉中国 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语法过后,不知道在哪里寻找案例上手.很多已经做案例 ...
- Java 集合框架综述,这篇让你吃透!
一.集合框架图 简化图: 说明:对于以上的框架图有如下几点说明 1.所有集合类都位于java.util包下.Java的集合类主要由两个接口派生而出:Collection和Map,Collection和 ...
- git使用-克隆仓库
1.git clone 克隆地址 克隆地址: 2.克隆命令
- 2020-06-14:Redis怎么实现分布式锁?
福哥答案2020-06-14: 1.SETNX+EXPIRE.非原子性.2.SET key value [EX seconds] [PX milliseconds] [NX|XX]EX second ...
- 2020-05-31:假如Redis里面有1亿个key,其中有10w个key是以某个固定的已知的前缀开头的,如何将它们全部找出来?
福哥答案2020-05-31: 使用keys指令可以扫出指定模式的key列表.对方接着追问:如果这个redis正在给线上的业务提供服务,那使用keys指令会有什么问题?这个时候你要回答redis关键的 ...
- C#LeetCode刷题之#706-设计哈希映射(Design HashMap)
问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/4116 访问. 不使用任何内建的哈希表库设计一个哈希映射 具体地说 ...
- CSS 点击img 或者 div 增加抖动(shake)效果
一般使用场景: 登录的错误验证 或者 强提醒 template 部分 <img id="barcode" :class="{ shaking: toShake}&q ...
- Golang 简单爬虫实现,爬取小说
为什么要使用Go写爬虫呢? 对于我而言,这仅仅是练习Golang的一种方式. 所以,我没有使用爬虫框架,虽然其很高效. 为什么我要写这篇文章? 将我在写爬虫时找到资料做一个总结,希望对于想使用Gola ...