前言

提示：一共分为3个页面来进行跨域操作和接口封装

一、第一个页面http接口路径

示例：swagger是的一种工具，该工具是为了解决数据接口文档而创建的

module.exports = {devServer: {host: 'localhost',port: 8080,proxy: {'/api': {target: 'http://api.vikingship.xyz',//接口的域名changeOrigin: true,//跨域pathRewrites: {'/aip': '',},},},},
}

二、第二个页面

import axios from 'axios'
const axioss = new axios.create({timeout: 50000
});export default axioss

三、第三个页面代码封装

代码如下（示例）：

import axioss from '../http/index'
export const reqHomeColumn = (page, size) => {return axioss.request({url: '/api/columns',method: 'get',params: {currentPage: page,pageSize: size}})
}
export const reqHome = (id) => {return axioss.request({url: `/api/columns/${id}`,method: 'get',})
}
export const req = (id) => {return axioss.request({url: `/api/columns/${id}/posts?currentPage={page}&pageSize={size}`,method: 'get',})
}

二、第二个页面数据渲染

  //获取数据，生命周期 - 创建完成（可以访问当前this实例）created() {reqHomeColumn(1, 6).then((res) => {console.log(res.data.data.list);this.layout = res.data.data.list;});},//详情页created() {console.log(this.$route.query.id);reqHome(this.$route.query.id).then((res) => {console.log(res.data.data);this.layout = res.data.data;});}

总结

这里对文章进行总结：
以上就是今天要讲的内容，本文仅仅简单介绍了swagger的API接口获取数据并且封装的使用，而swagger能使我们快速便捷的找到数据接口。

~ 喜欢的小伙伴点个赞呗，评论区留下宝贵的意见-谢谢呐♥~
如果文章当中有问题，或者有什么好的意见，大家可以指出来，一起学习。
本文版权归作者所有，欢迎转载。

如何使用swagger的API接口获取数据并且封装相关推荐

如何利用python调用API接口获取数据进行测试
一.Python 可以使用 requests 库来调用 API 接口获取数据.以下是基本的步骤: 1.安装 requests 库 pip install requests 2.导入 requests ...
通过API接口获取数据至后台
前言:这是我第一次写CSDN,如果有什么不对的地方麻烦指导一下正题:不知道各位在项目中有没有遇到项目联动情况,比如其他项目的会员,可能在这边也需要使用,如果有,那么这篇文章可能对你有用因为数据量可 ...
盲僧发现了华点——教你如何使用API接口获取数据
那么先介绍一下我们的老朋友 "API" 一.API是什么 API是应用程序的开发接口,在开发程序的时候,我们有些功能可能不需要从到到位去研发,我们可以拿现有的开发出来的功能模块来 ...
python调用api接口获取数据_python批量爬取NCBI基因注释并调用谷歌API批量翻译
作者:沙雕学习小组这里有视频教程:https://www.bilibili.com/video/av87724182 今天想实现这个功能: 差异分析得到了200多个基因(甚至更多) 我要一个一个把基 ...
拼多多商品数据如何通过api接口获取
要从拼多多获取商品数据,可以使用拼多多提供的API接口.首先需要注册一个拼多多开放平台的开发者账号,然后创建一个应用程序,获取应用程序的app_id和app_secret,以在API请求中进行身份验证 ...
如何调用api接口获取其中的数据
part1.API接口可以运用到的场景,主要包括以下几个方面: 1. 应用程序集成:API可以使不同的应用程序相互之间进行集成,比如将某个应用程序的数据传递给另一个应用程序,或者调用另一个应用程序的功 ...
通过API接口获取下来的数据需要怎样才能应用
获取到API接口下来的数据之后,为了能够在自己的项目或应用中进行应用开发,需要进行一些必要的数据处理和解析,主要包括以下几个方面: 数据格式解析:数据获取下来通常是以JSON或XML等格式进行返回的, ...
「API 接口获取方法」
在创建一个应用程序的过程中,获取数据是非常关键的一步.而通过API接口获取数据通常是最好的方式之一.那么,如何通过关键字获取API接口呢?以下是一些步骤: 1.确定你需要获取的数据类型首先,你需要确 ...
调用API接口获取和解析京东按关键字搜索商品数据
这篇文章主要介绍了如何调用API接口获取和解析京东按关键字搜索商品数据,帮助大家更好的理解和使用API接口. 点击测试请求示例 <?php// 请求示例 url 默认请求参数已经URL编码处 ...
怎么获取服务器接口文档,服务器接口获取数据
服务器接口获取数据内容精选换一换伸缩组是具有相同应用场景的实例的集合,是启停伸缩策略和进行伸缩活动的基本单位.伸缩组内定义了最大实例数.期望实例数.最小实例数.虚拟私有云.子网.负载均衡等信息. ...

如何使用swagger的API接口获取数据并且封装

文章目录

前言

一、第一个页面http接口路径

二、第二个页面

三、第三个页面代码封装

二、第二个页面数据渲染

总结

如何使用swagger的API接口获取数据并且封装相关推荐

最新文章

热门文章