axios模块封装
2024-08-29 06:36:42
1.新建文件夹 network 在文件新建 request.js
request.js:
import axios from 'axios' export function request (config) {
// 1创建axios实例
const intstance = axios.create({
baseURL: 'https://localhost:44314',
timeout: 5000
// contentType: 'application/json;charset=UTF-8',
// dataType: 'json'
}) // 1.axios拦截器
intstance.interceptors.request.use(config => {
return config
}, er => {}) // 1.axios响应拦截拦截
intstance.interceptors.response.use(res => {
return res
}, er => {
}) return intstance(config) } export default request //导出
2.main.挂载配置
import request from '@/network/request' new Vue({
el: '#app',
router,
store,
request, // 封装的axios
components: { App },
template: '<App/>' })
3.在需要使用axios的vue组件调用
import request from '@/network/request' request({ // 查询所有
url: '/api/Gj'
}).then(res => {
this.tableData = res.data
}) request({ // 条件查询
url: '/api/Gjtype/' + gjtype
}).then(res => {
this.tableData = res.data
}) request({ // 添加
url: '/api/Gj',
method: 'POST',
data: {
'id': 0,
'method': this.method,
'text': this.content,
'type': this.value
}
}).then(res => {
console.log(res)
if (res.status === 201) {
this.open1()
console.log('成功')
} else {
this.open4()
console.log('失败')
}
}).catch(console.error.bind(console)) // 异常 request({// 更新
url: '/api/Gj/' + this.id,
method: 'put',
data: {
'id': this.newinfo.id,
'method': this.newinfo.method,
'text': this.newinfo.text,
'type': this.newinfo.type
}
}).then(res => {
if (res.status === 204) {
this.open1()
console.log('成功')
} else {
this.open4()
console.log('失败')
}
}).catch(console.error.bind(console)) // 异常
最新文章
- CYQ.Data V5 从入门到放弃ORM系列:教程 - AppConfig、AppDebug类的使用
- shell脚步传参
- dedecms为什么文档标题最大长度只能显示二十个汉字呢?
- 百度网盘生成二维码api
- Linux4:useradd、userdel、passwd、groupadd、chgrp、chown、df、du、sort、wget
- 基于 flow.ci 实现 PHP 项目自动化持续集成
- 快速入门系列--MVC--05行为
- Grunt vs Gulp
- PostgreSQL9.1 upgrade to PostgreSQL9.5rc1
- Unity-Animator深入系列---测试CrossFade和CrossFadeInFixedTime
- xml配置文件详解
- [HttpException (0x80004005): The current identity
- UIView frame, bounds and center
- 【C++】ubuntu中读取指定目录中的所有文件
- 用IntelliJ IDEA搭建第一个SpringBoot例子
- css样式之补充。。。
- dagger2 重点笔记
- 【转】如果有人让你推荐Python技术书,请让他看这个列表
- 题目1456:胜利大逃亡(广度优先搜索BFS)
- eclipse使用egit插件