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的更多相关文章

  1. 【手摸手,带你搭建前后端分离商城系统】02 VUE-CLI 脚手架生成基本项目,axios配置请求、解决跨域问题

    [手摸手,带你搭建前后端分离商城系统]02 VUE-CLI 脚手架生成基本项目,axios配置请求.解决跨域问题. 回顾一下上一节我们学习到的内容.已经将一个 usm_admin 后台用户 表的基本增 ...

  2. 02 . 处理axios的三个问题 :设置基路径/axios挂载到vue原型/请求时自动携带token

    //使用API时必须在请求头中使用 Authorization 字段提供 token 令牌 import axios from 'axios' // 处理axios的三个问题 // 处理一:基路径 a ...

  3. 02 Vue之vue对象属性功能&axios数据请求实现

    1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...

  4. 06-vue项目02:vuex、Mutation、Action、ElementUI、axios

    1.Vuex 1.为什么使用VueX data从最上面的组件,一层层往下传值,一层层的验证 Vue单向数据流 “中央空调“,代理 VueX 解决数据 传值.. 2.Vuex介绍与安装 (1)Vuex官 ...

  5. python接收axios的post请求,并处理后返回数据

    公司的python工程师不会js和python数据交互,所以我就去试了一下. 首先安装python,django框架和django-cors-headers. python官网下载,按提示操作,记住最 ...

  6. 二: vue的属性及功能,axios

    一: 过滤器 1. 定义:    过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 2.使用vue.filter()进行全局定义 ...

  7. 搭建vue脚手架,包含Axios、qs、Element-UI、mock等插件的安装配置

    1.安装node.vue这些最基础最简单的安装的就一一省略过. 1.1 axios 安装 1.2安装 Element-Ui 插件 1.3 安装 qs 1.4  安装 Mock 2.新建一个vue工程, ...

  8. Axios & fetch api & Promise & POST

    Axios & fetch api & Promise & POST https://github.com/axios/axios https://appdividend.co ...

  9. 【转】axios全攻略

    随着 vuejs 作者尤雨溪发布消息,不再继续维护vue-resource,并推荐大家使用 axios 开始,axios 被越来越多的人所了解.本来想在网上找找详细攻略,突然发现,axios 的官方文 ...

随机推荐

  1. Kibana配置nginx反代并本地ca加密nginx

    简介 我们部署完ELK Stack后,虽然可以直接浏览器访问kibana进行访问,但这样对一些重要数据来说是不安全的,可以利用密码验证设置权限访问,在Kibana所在的服务器上安装Nginx服务,利用 ...

  2. java 用集合完成随机点名器和库存管理案例

    一 随机点名器 1.案例需求 随机点名器,即在全班同学中随机的找出一名同学,打印这名同学的个人信息. 我们来完成随机点名器,它具备以下3个内容: 存储所有同学姓名 总览全班同学姓名 随机点名其中一人, ...

  3. C#LeetCode刷题之#441-排列硬币(Arranging Coins)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3995 访问. 你总共有 n 枚硬币,你需要将它们摆成一个阶梯形状 ...

  4. 个性探测综述阅读笔记——Recent trends in deep learning based personality detection

    目录 abstract 1. introduction 1.1 个性衡量方法 1.2 应用前景 1.3 伦理道德 2. Related works 3. Baseline methods 3.1 文本 ...

  5. Oracle用户授权

    一.用户授权 1)普通权限 grant ${autoType1, autoType2, autoType3, ...} to ${userName} identified by ${password} ...

  6. 在K3s上使用Kong网关插件,开启K3s的无限可能!

    我的工作中很重要的一部分是参加各种各样的技术会议.最近参加的是去年11月的北美KubeCon,在会议的最后一天,所有人都焦头烂额,我也一直机械地向不同的人重复我的自我介绍.后来,我已经十分烦躁,决定逃 ...

  7. Nginx CORS 跨域资源共享问题

    ## 背景 新项目上线,前后端分离,遇到了跨域资源共享的问题,导致请求根本无法发送到后端,前端和后端貌似只能有一个来处理跨域问题,我们这边要采用nginx来解决跨域问题. ## Nginx的CORS配 ...

  8. [noip2002] 产生数

    题目描述 给出一个整数 n (n<1030)和 k 个变换规则 (k < 15) . 规则: 一位数可变换成另一个一位数: 规则的右部不能为零. 例如:n = 234 .有规则( k=2  ...

  9. Debug很重要

    之前做一个小功能,就是用php发送邮件,项目中已经使用了wordpress的wp_mail,所以同事建议我继续用wp_mail函数. 然而遇到了一个奇怪的情况,邮件没有发出去,也没有任何报错日志. 照 ...

  10. Java引用类型之最终引用

    FinalReference类只有一个子类Finalizer,并且Finalizer由关键字final修饰,所以无法继承扩展.类的定义如下: class FinalReference<T> ...