基本的axios用法
首先安装axios:
- 1):npm install
- 2):npm install vue-axios --save
- 3):npm install qs.js --save //它的作用是能把json格式的直接转成data所需的格式
安装成功后,在main.js页面引用:

- import Vue from 'vue'
- import axios from 'axios'
- import qs from 'qs'
- Vue.prototype.$axios = axios //全局注册,使用方法为:this.$axios
- Vue.prototype.qs = qs //全局注册,使用方法为:this.qs

最后开始使用请求:

- <script>
- export default{
- data(){
- return{
- userId:666,
token:'',- }
- },
- created(){
- this.$axios({
- method:'post',
- url:'api',
- data:this.qs.stringify({ //这里是发送给后台的数据
- userId:this.userId,
- token:this.token,
- })
- }).then((response) =>{ //这里使用了ES6的语法
- console.log(response) //请求成功返回的数据
- }).catch((error) =>{
- console.log(error) //请求失败返回的数据
- })
- }
- }
- </script>

本文介绍的是axios的基本用法,详细看官方文档https://github.com/axios/axios
基本的axios用法的更多相关文章
- 第六节:前后端交互之axios用法及async异步编程
一. axios用法 参考: API文档: https://www.kancloud.cn/yunye/axios/234845 GitHub: https://github.com/axios/ax ...
- Vue2.0学习——axios用法详解
功能特性 在浏览器中发送 XMLHttpRequests 请求 在 node.js 中发送 http请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 自动转换 JSON 数据 客 ...
- axios 用法简介(转载)
axios 来源:https://www.jianshu.com/p/df464b26ae58 一.安装 1. 利用npm安装npm install axios --save2. 利用bower安 ...
- axios用法
1 axios.get('https://api.apiopen.top/getJoke?type=all', { 2 params: {//用于传参 3 type: 'all' 4 } 5 }).t ...
- ajax、fetch、axios — 请求数据
jquery ajax jq 的ajax是对原生XHR的封装,除此以外还增添了对JSONP的支持.用起来非常方便 用法: $.ajax({ url:发送请求的地址, data:数据的拼接,//发送到服 ...
- 理解 ajax、fetch和axios
背景 ajax fetch.axios 优缺点 ajax基于jquery,引入时需要引入庞大的jquery库,不符合当下前端框架,于是fetch替代了ajax 由于fetch是比较底层,需要我们再次封 ...
- vue.js+koa2项目实战(五)axios 及 vue2.0 子组件和父组件之间的传值
axios 用法: 1.安装 npm install axios --save-dev 2.导入 import axios from 'axios'; 3.使用 axios.post(url,para ...
- axios用法全解
[前言] 本文介绍下axios用法,希望对大家有所帮助 这里声明一句:请求数据一般放置到哪里?详见下篇文章 [主体] (1)下载 npm i axios --save (2)引入axios模块 方式1 ...
- 简简单单的Vue4(vue-cie@3.x,vue’Debug[调试],vue‘sHttp)
既然选择了远方,便只顾风雨兼程! __HANS许 系列:零基础搭建前后端分离项目 系列:零基础搭建前后端分离项目 vue-cli@3.x 创建项目 Vue的Debug(调试) Vue的Http请求 提 ...
随机推荐
- maven坐标Dependencies和Exclusions详解
1.概念介绍 Dependencies:是可选依赖(Optional Dependencies) Exclusions:是依赖排除(Dependency Exclusions) 2.Dependenc ...
- vue点击出现蒙版
需求: 1.点击一个事件时弹出一个蒙版: 2.蒙版上有取消,删除事件:(点击取消时候蒙版消失,点击删除时,删除蒙版并消失): 3.点击空白地方,蒙版也消失: <template> ...
- intellij 编译 springmvc+hibernate+spring+maven 找不到hbm.xml映射文件
1. 错误信息 Invocation of init method failed; nested exception is org.hibernate.MappingNotFoundException ...
- 014-Zabbix的自动发现
Zabbix自动发现是通过(1)网络扫描或(2)代理主动发现实现监控.本文主要介绍网络扫描的发现方式,并深入介绍底层监控项的主动发现功能. 网络发现(Discovery) 对于网络发现最需要理解的就是 ...
- oracle高水位降低法
1.什么是高水位?(high water mark 简称:HWM) 所有的oracle段(segments,在此,为了理解方便,建议把segment作为表的一个同义词)都有一个在段内存放数据的 ...
- c字符串函数
1. bcmp(3) 类ma似于strncmp(3) 但是比较结果不一定是两个字符的ascii码之差. 返回值:相等0,不相等非零(不一定是-1) 2.bcopy(3)类ma似于strncpy(3) ...
- linux高性能服务器编程pdf免费下载
百度云盘:链接: https://pan.baidu.com/s/1pLp4hHx 密码: wn4k
- FCC 成都社区·前端周刊 第 6 期
01. JS 引擎 V8 v6.6 的更新 最新 v6.6 版本的 V8 JavaScript 引擎更新了方法 Function.prototype.toString(),改进了代码缓存机制.异步性能 ...
- Kendo UI使用教程:CDN服务
[Kendo UI最新试用版下载] Kendo UI目前最新提供Kendo UI for jQuery.Kendo UI for Angular.Kendo UI Support for React和 ...
- Tronado【第2篇】:tronado自定义Form组件
Tronado自定义Form组件 一.获取类里面的静态属性以及动态属性的方法 方式一: # ===========方式一================ class Foo(object): user ...