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 的官方文 ...
随机推荐
- spring data jap的使用 1
最近一直在研究Spring Boot,今天为大家介绍下Spring Data JPA在Spring Boot中的应用,如有错误,欢迎大家指正. 先解释下什么是JPA JPA就是一个基于O/R映射的标准 ...
- JS pc端网页特效
offset offset翻译就是偏移量,可以使用他相关的属性可以动态的得到该元素的位置.大小等等 获得元素距离带有定位父元素的位置 获得元素自己的大小(宽度高度) 注 ...
- 智能问答中的NLU意图识别流程梳理
NLU意图识别的流程说明 基于智能问答的业务流程,所谓的NLU意图识别就是针对已知的训练语料(如语料格式为\((x,y)\)格式的元组列表,其中\(x\)为训练语料,\(y\)为期望输出类别或者称为意 ...
- 《Java核心技术(卷1)》笔记:第12章 并发
线程 (P 552)多进程和多线程的本质区别:每一个进程都拥有自己的一整套变量,而线程共享数据 (P 555)线程具有6种状态: New(新建):使用new操作符创建线程时 Runnable(可运行) ...
- Django记录数据库创建、更新、删除操作开源插件推荐
github: django-simple-history - 安装 $ pip install django-simple-history - 配置 在Settings中添加 INSTALLED_A ...
- CTFhub-WEB前置-http协议闯关
前情提要: 在渗透学习过程中,web的基础知识很重要,在这里通过long long ago之前学习的http基础,并结合网上的CTFhub--WEB前置之http协议闯关,对web基础知识进行加固并查 ...
- vue cli 中关于vue.config.js中chainWebpack的配置
Vue CLI 的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...
- 关于初次使用Thymeleaf遇到的问题 2020-08-11
关于初次使用Thymeleaf遇到的问题 环境: IDEA :2020.1 Maven:3.5.6 SpringBoot: 2.3.2 原做法: 按照视频教程,导入依赖,并修改报的版本为3.0.9,适 ...
- Javascript模块化编程(二):AMD规范 (转)
原文作者: 阮一峰 日期: 2012年10月30日 这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? ...
- Invalid credentials for 'https://repo.magento.com/packages.json'
Use your public key as username and private key as password from your magento connect account You ca ...