当前位置: 首页 > article >正文

Vue2:请求接口的两种方式axios和vue-resource

一、场景描述

前端和后端的交互,肯定是要发生接口调用的
这个时候,就要涉及前端如何向后端接口发送请求,获取数据

二、请求方式

1、axios方式(推荐)

这个方式本质就是ajax,底层就是对xhr(XMLHttpRequest)的封装

1、安装axios库
	npm i axios
2、在对应的vue组件里importimport axios from 'axios'
3、具体使用
                axios.get(`https://api.github.com/search/users?q=${this.keyWord}`).then(
                    response => {
                        console.log('请求成功了',response.data);
                    },
                    error => {
                        console.log('请求失败了',error.message);
                    }
                )

2、vue-resource方式

底层就是对xhr的封装,它是一个插件

1、安装vue-resource插件
	npm i vue-resource
2、mainjs文件中use插件
	//使用插件      这样,vm和vc身上都有了这个插件功能     多了一个$http
	Vue.use(vueResource);
3、具体使用
                this.$http.get(`https://api.github.com/search/users?q=${this.keyWord}`).then(
                    response => {
                        console.log('请求成功了',response.data);
                    },
                    error => {
                        console.log('请求失败了',error.message);
                    }
                )

http://www.kler.cn/a/226568.html

相关文章:

  • Python Moviepy 视频编辑踩坑实录2:音频如何修改为单通道
  • 蓝桥杯省赛无忧 课件70 第九次学长直播带练配套课件
  • 什么是TCP粘包和半包问题?如何解决?
  • mysql b+搜索的算法次数的计算
  • Android13源码下载及全编译流程
  • Vue打包Webpack源码及物理路径泄漏问题解决
  • 【QT】贪吃蛇小游戏 -- 童年回忆
  • 交换机 路由器 网卡 MAC
  • 决策树的相关知识点
  • React16源码: React中event事件触发的源码实现
  • -代码分享-
  • QSqlRelationalTableModel 关系表格模型
  • PPT录屏功能在哪?一键快速找到它!
  • 笔记本加装内存条
  • 算法学习——华为机考题库1(HJ1 - HJ10)
  • 07 SB3之@HttpExchange(TBD)
  • 什么是单例模式与饿汉式单例模式的区别是什么?
  • Mac 上如何安装Mysql? 如何配置 Mysql?以及如何开启并使用MySQL
  • C#实现windows系统重启、关机
  • C++函数分文件编写之VScode版