vue封装axios方法推荐)
目录结构:
api.js
export default {
myTopic: '/api/subscribe-data/post/cat'
}
request.js
import axios from 'axios'
import apis from './api'
import root from './root'
const request = axios.create({
baseURL: root.httpUrl
}) export default {
// post
post (urlKey, params) {
return request({
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'},
method: 'post',
url: apis[urlKey],
data: params
})
}
}
root.js
const root = {
httpUrl: '//neican.ink:2080'
}
export default root
在main.js中
import request from '../apis/request.js'
Vue.prototype.$request = request
在组件中就可以使用request.post进行请求了
this.$request.post('myTopic').then((res)=>{
console.log(res)
})
vue封装axios方法推荐)的更多相关文章
- Vue 封装axios(四种请求)及相关介绍(十三)
Vue 封装axios(四种请求)及相关介绍 首先axios是基于promise的http库 promise是什么? 1.主要用于异步计算 2.可以将异步操作队列化,按照期望的顺序执行,返回符合预期的 ...
- 封装axios方法之一
一.先来说说为什么要封装axios异步请求. 我们前端开发中总是会遇到跨域的问题,我们会配置proxy来解决跨域的问题,无论是vue 还是react. 如何配置我这里就不说了. 然后...然后我们就会 ...
- vue 封装axios以及使用中间代理 proxy
为什么需要封装呢?主要是为了更好管理项目以及增加复用性 1.首先在src文件夹下创建api文件夹 . utils文件夹 . server文件夹 api:创建一个index.js文件 用来存放接口地 ...
- vue中封装axios方法
axios基本配置 使用方法 import axios from 'axios' // 创建axios实例 const service = axios.create({ baseURL: proces ...
- vue封装axios
一.安装axios npm install --save axios 二.在src下面创建文件夹api=>api.js(接口集合)+http.js(封装的请求) 三.在main.js中引用api ...
- vue 封装 axios 和 各类的请求,以及引入 .vue 文件中使用
//src 底下建立 api 文件夹 // api 文件夹下建立 request,js 文件,文件内容复制下面这段代码即可 /** * ajax请求配置 */ import axios fro ...
- vue axios接口封装、Promise封装、简单的axios方法封装、vue接口方法封装、vue post、get、patch、put方法封装
相信大家在做前后端数据交互的时候都会给请求做一些简单的封装就像之前封装ajax方法一样axios的封装也是一样的简单下面这个就是封装的axios的方法,require.js import axios ...
- vue中Axios的封装和API接口的管理
前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...
- vue中axios的封装
第一步还是先下载axios cnpm install axios -S 第二步建立一个htttp.js import axios from 'axios'; import { Message } fr ...
随机推荐
- 理解IO、NIO、 AIO
转载:https://baijiahao.baidu.com/s?id=1586112410163034993&wfr=spider&for=pc nio 同步: 自己亲自出马持银行卡 ...
- Win10系统如何在防火墙里开放端口
Win10系统如何在防火墙里开放端口(下面傻瓜式教学) 然后怎么做呢?????? 下一步.下一步.下一步.下一步.下一步.下一步.下一步.下一步.下一步.下一步......... 随便起个名字 KO
- Linux内核入门到放弃-设备驱动程序-《深入Linux内核架构》笔记
I/O体系结构 总线系统 PCI(Peripheral Component Interconnect) ISA(Industrial Standard Architecture) SBus IEEE1 ...
- split函数用法
split函数详解 split翻译为分裂. split()就是将一个字符串分裂成多个字符串组成的列表. split()当不带参数时以空格进行分割,当代参数时,以该参数进行分割. //---当不带 ...
- Entity Framework Core系列之DbContext(删除)
上一篇我们介绍了Entity Framework Core系列之DbContext(修改),这一篇我们介绍下删除数据 修改实体的方法取决于context是否正在跟踪需要删除的实体. 下面的示例中con ...
- Activiti6-数据库配置-dbconfig(学习笔记)
常用数据连接池种类: 不一样的地方在于filters过滤器,设置了统计.和记录 avtiviti支持的数据库有: <?xml version="1.0" encoding=& ...
- libstdc++.so.6: cannot open shared object file: No such file or directory
sudo apt-get install lib32stdc++6 sudo apt-get install lib32z1
- Linux 学习 (九) 网络基础
Linux网络管理 学习笔记 ISO/OSI 七层模型 ISO :国际标准化组织 OSI :开放系统互联模型 应用层.表示层.会话层服务于用户 传输层.网络层.数据链路层.物理层服务于实际数据传输 帧 ...
- 21.Pod的limit和request和资源监控收集服务Heapster
容器的资源需求,资源限制 requests:需求,最低保障: limits:限制,硬限制: CPU: 1颗逻辑CPU =,millicores 500m=.5CPU 内存: E.P.T.G.M.K E ...
- 字符串格式的方法%s、format和python3.6新特性f-string和类型注解
一.%s msg = '我叫%s,今年%s,性别%s' %('帅哥',18,'男') print(msg) # 我叫帅哥,今年18,性别男 二.format # 三种方式: # 第一种:按顺序接收参数 ...