axios安装与基本方法
安装:
1.npm安装:
npm install axios
2.在主入口文件main.js中引用:
import axios from 'axios'Vue.use(axios);
3.在组件文件中的methods里使用:
<template><section class="jumbotron"><h3 class="jumbotron-heading">Search Github Users</h3><div><input type="text" placeholder="enter the name you search" v-model="keyWord"/> <button @click="searchUsers">Search</button></div></section>
</template><script>import axios from 'axios'export default {name:'Search',data() {return {keyWord:''}},methods: {searchUsers(){//请求前更新List的数据this.$bus.$emit('updateListData',{isLoading:true,errMsg:'',users:[],isFirst:false})axios.get(`https://api.github.com/search/users?q=${this.keyWord}`).then(response => {console.log('请求成功了')//请求成功后更新List的数据this.$bus.$emit('updateListData',{isLoading:false,errMsg:'',users:response.data.items})},error => {//请求后更新List的数据this.$bus.$emit('updateListData',{isLoading:false,errMsg:error.message,users:[]})})}},}
</script>
常用API:
1.get请求:查询数据,直接从后台获取数据,参数写在地址(url)里,第一个参数是url(API的一个地址,由后端提供);
2.post请求:添加数据,一般在填写表单并提交时,要将输入的数据写在数据库里,参数一般放在对象中;
3.put请求:修改数据
4.delete请求:删除数据
使用方式示例
1.执行get数据请求
axios.get('url',{params:{id:'接口配置参数(相当于url?id=xxxx)',},
})
.then((res)=>{console.log(res); // 处理成功的函数 相当于success
})
.catch((error)=>{console.log(error) // 错误处理 相当于error
})
2.执行post数据发送
const data = {name:'张三',age:23
}
axios.post('url',data)
.then((res)=>{console.log(res); // 处理成功的函数 相当于success
})
.catch((error)=>{console.log(error) // 错误处理 相当于error
})
3.执行delete 数据发送
// 如果服务端将参数作为java对象来封装接受
axios.delete('demo/url', {data: {id: 123,name: 'Henry',},timeout: 1000,
})
// 如果服务端将参数作为url参数来接受,则请求的url为:www.demo/url?a=1&b=2形式
axios.delete('demo/url', {params: {id: 123,name: 'Henry',},timeout: 1000
})
4.执行put 数据发送
axios.put('demo/url', {id: 123,name: 'Henry',sex: 1,phone: 13333333
})
示例摘自:
axios使用方法 - 简书
axios安装与基本方法相关推荐
- axios安装_Vue脚手架安装,与基本语法(干货)
首先,这篇Vue文章是为了下一篇我整合springboot+vue前后分离的小demo,这两天整理好会上传哈哈 ============================================ ...
- php symfony 安装,Symfony的安装和配置方法
这篇文章主要介绍了Symfony的安装和配置方法,分析了使用Composer安装Symfony的具体步骤与相关技巧,需要的朋友可以参考下 本文实例讲述了Symfony的安装和配置方法.分享给大家供大家 ...
- 树莓派安装python3.5+tensorflow_树莓派4B安装Tensorflow的方法步骤
1.写作背景 Tensorflow官方在2018年宣布,正式发布支持树莓派版本的Tensorflow,编者开始直接用: pip install tensorflow 进行安装,在安装成功后使用impo ...
- linux rpm目录,Linux修改RPM的安装目录的方法
Linux系统下大多数人都是使用rpm -i xxxx.rpm命令来安装RPM包,这种情况下RPM会被安装在默认的目录当中.如果不想把RPM安装在这个目录下应该怎么办呢?下面就来介绍一下Linux如何 ...
- python安装位置是固定的吗_pip指定python位置安装软件包的方法
由于电脑上安装了多个版本的pip,以及不同的pip对应不同的python,因此有时候使用pip install安装某个包时,可能会没有安装在想要的位置. 具体而言,在我电脑上,运行pip --vers ...
- 安装报错_RG Magic Bullet安装报错修复方法
RG Magic Bullet安装报错修复方法 安装和谐版红巨星插件发现有很大的概率报错.这几天重装电脑被这个插件搞得头大.网上查了一些排除错误的方法,基本错误可以靠删除一些重复的文件夹和老版本来修复 ...
- db2top详细使用方法_Py之PIL:Python的PIL库的简介、安装、使用方法详细攻略
Py之PIL:Python的PIL库的简介.安装.使用方法详细攻略 目录 PIL库的简介 PIL库的安装 PIL库的用方法 1.几何图形的绘制与文字的绘制 2.绘制图形的各种案例 PIL库的简介 PI ...
- debian卸载php_在Debian10上安装PHP的方法
在Debian10上安装PHP的方法 发布时间:2020-08-24 12:05:38 来源:亿速云 阅读:89 作者:小新 小编给大家分享一下在Debian10上安装PHP的方法,相信大部分人都还不 ...
- Oracle数据库远程连接方式之一:不需要安装客户端软件方法!
连接Oracle数据库,通过远程的方式,有很多种.这里主要是跟大家说明一个简单的方法:不需要安装软件的方法! 具体内容: 1.在Oracle官网上下载程序. 下载地址:http://www.oracl ...
- Sublime Text 安装插件的方法
Sublime Text因为拥有众多插件而具备强大的功能.有时候公司的电脑是不能直接上外网的,那么给Sublime Text安装插件时就不能使用在线搜索安装的方式.本人经过几小时的研究和探索,终于找到 ...
最新文章
- Evernote中国版、优秀的笔记软件
- python内置json模块的作用_python详解json模块
- Linux基础命令---su 1
- 视觉SLAM笔记(57) 回环检测
- idea中java没有run_idea 右键项目没有run 运行选项
- 什么是 USB 3.1
- 服务器指令学习记录-----ska暑期训练
- HTML lt input gt 标签,科技常识:使用amp;lt;labelamp;gt;标签修改input[type=checkbox]的样式...
- 【Altium Designer】PCB如何生成Gerber文件
- COMSOL有限元仿真深度指南:超弹性模型有限元分析入门
- 嵌入式系统的开发概述(三星s5p6818系统为例)
- 彻底清理该死的搜狗输入法
- 质量功能配置(QFD)矩阵
- python3,烤地瓜案例
- 你不一定知道这个用 Python 快速设置 Excel 表格边框的技巧
- servlet登录验证并返回错误信息
- kfc小程序_利用实验室成长的“未来之肉”将肯德基转换为3D打印鸡肉
- 算24点我的算法分享
- 佩尔方程(超详细推导+例题讲解) 每日一遍,算法再见!
- 3.7V降压3V超低功耗稳压芯片,外围简单