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 的官方文 ...
随机推荐
- Python 教你自动发微博,每日一句英语
作者:周萝卜 最近在研究用 Python 来制作各个类别的机器人,今天先来分享一个自动发布新浪微博的机器人. 基本思路 其实要实现一个简单的自动发布微博机器人还是不难的,只需要每天按时找好要发布的素材 ...
- 为什么overflow:hidden能达到清除浮动的目的?
1. 什么是浮动 <精通CSS>(第3版)关于浮动的描述: 浮动盒子可以向左或向右移动,直到其外边沿接触包含块的外边沿,或接触另一个浮动盒子的外边沿. 浮动盒子也会脱离常规文档流,因此常规 ...
- Phthon环境搭建
一,官网去下载 https://www.python.org/downloads/ 二,安装 三,验证python 四.IPython IPython 是一个 python 的交互式 shell,比默 ...
- System.out.println()相关源码
System.out.println是一个Java语句,一般情况下是将传递的参数,打印到控制台. System:是 java.lang包中的一个final类.根据javadoc,“java.lang. ...
- TCP学习指北
限于博主水平有限不敢说指南,但应该能够避免刚学TCP的同学出现找不着北的情况. TCP与UDP的区别 区别: UDP是无连接的,而TCP是面向连接的,传数据前要先建立连接. UDP可以一对多,多对多通 ...
- C++socket编程write()、read()简介及与send()、recv()的区别
1. write 函数原型:ssize_t write(int fd, const void*buf,size_t nbytes)write函数将buf中的nbytes字节内容写入文件描述符fd.成功 ...
- C#LeetCode刷题之#56-合并区间(Merge Intervals)
问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3676 访问. 给出一个区间的集合,请合并所有重叠的区间. 输入: ...
- 图论算法(四)Dijkstra算法
最短路算法(三)Dijkstra算法 PS:因为这两天忙着写GTMD segment_tree,所以博客可能是seg+图论混搭着来,另外segment_tree的基本知识就懒得整理了-- Part 1 ...
- 输入url后的加载过程~
1)查找域名对应的IP地址: 2)建立连接(TCP的三次握手): 3)构建网页: 4)断开连接(TCP的四次挥手): TCP的三次握手:为了准确无误的把数据送到目标处,TCP协议采用了三次握手策略,用 ...
- VUE数据更新视图不更新的原因
当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue当你修改数组的长度时,例如:vm.items.length = newLength 数组更新只能通过 ...