基本的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请求 提 ...
随机推荐
- Python 入门之 内置模块 -- os模块
Python 入门之 内置模块 -- os模块 1.os os是和操作系统做交互,给操作发指令 os模块是与操作系统交互的一个接口,它提供的功能多与工作目录,路径,文件等相关 (1)工作路径 prin ...
- go语言中os/signal包的学习与使用
package main; import ( "os" "os/signal" "fmt" ) //signal包中提供了两个函数 //No ...
- [WPF]BringIntoView
1.在scrollview 中的frameworkelement可以使用 FE.BringIntoView(); 滚动到此控件. 2.该 方法能一个重载 Bottom.BringIntoView(ne ...
- HTML5的几大新特性
为了更好地处理今天的互联网应用,HTML5添加了很多新元素及功能,比如: 图形的绘制,多媒体内容,更好的页面结构,更好的形式 处理,和几个api拖放元素,定位,包括网页 应用程序缓存,存储,网络工作者 ...
- 如何使用前端分页框架bootstrap paginator
前端分页框架bootstrap paginator用于web前端页面快速实现美观大方的翻页功能.在实现交互良好的页面翻页功能时,往往还需要配合使用后端分页框架pagehelper.pagehelper ...
- CodeReview的一些原则
架构/设计/常规角度: 单一职责原则 一个类只能干一个事情,一个方法最好也只干一件事情.一个类既干UI的事情,又干逻辑的事情,这个在低质量的代码里是很常见. 行为是否统一 缓存是否统一 错误处理是否统 ...
- Wide&Deep 模型学习教程
WDL 学习教程 推荐系统+WDL 教学视频: https://www.bilibili.com/video/av29905315/ WDL 模型介绍: https://blog.csdn.net/g ...
- php随机获取数组里面的值
srand() 函数播下随机数发生器种子,array_rand() 函数从数组中随机选出一个或多个元素,并返回.第二个参数用来确定要选出几个元素.如果选出的元素不止一个,则返回包含随机键名的数组,否则 ...
- Codeforces 965 枚举轮数贪心分糖果 青蛙跳石头最大流=最小割思想 trie启发式合并
A /*#include<cstring>#include<algorithm>#include<queue>#include<vector>#incl ...
- MySQL 数据库的创建、修改、删除、跳转
一. 创建数据库 []代表可选项. IF NOT EXISTS:在创建数据库之前进行判断,只有该数据库目前尚不存在时才能执行操作. <数据库名>:创建数据库的名称.MySQL 的数据存储区 ...