Vue js封装接口

news2024/11/14 0:55:46

天梦星服务平台 (tmxkj.top)icon-default.png?t=N7T8https://tmxkj.top/#/

1.安装axios

npm install axios -g

2.在src下新建一个Api文件夹,再创建一个js文件

import axios from 'axios'
let configuration = {
	url:"http://localhost:9090"
}
/**
 * 请求项目数据的请求体
 */
async function http({ url, method, param }) {
	const httpUrl = configuration.url + url
	if (method === 'GET') {
		httpUrl + jsonToGetParams(param)
	}
	const { data } = await axios({
		url: httpUrl,
		method: method ? method : 'GET',
		data: method === 'GET' ? {} : param,
		headers: {
			'content-type': 'application/json',
			token: localStorage.getItem('token') || ''
		}
	})
	return data
}
async function ask(e) {
	return http({
		url: e[0],
		method: e[1],
		param: e[2]
	})
}
export { ask }

/**
 * GET参数转字符串
 * @param jsonObj
 * @returns {string}
 */
function jsonToGetParams(jsonObj) {
	const params = Object.entries(jsonObj)
		.map(([key, value]) => `${key}=${value}`)
		.join('&')
	if (params.length >= 1) {
		return '?' + params
	} else {
		return params
	}
}

3.在src下新建一个Interface文件夹,里面单独存放接口,用户接口就创建UserApi.js文件,文件接口就创建FileApi.js

import {ask} from "../Api/requestBody";

/**
 * 查询用户接口
 */
export function getQueryUser(param){
    return ask(['/user/queryUser','GET',param]);
}

4.来到vue页面调用

 getQueryUserFun(){
      getQueryUser({
        id:"2222"
      }).then(res=>{
        console.log(res)
      })
    }

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1536577.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

从错误中进行上下文学习

1、写作动机: 在上下文学习中,也称为少样本提示(ICL),一直是调整LLM适应下游任务的标准方法,通过从少量输入-输出示例中学习。然而,所有基于ICL的方法都只从正确的输入-输出对中学习。 2、主要…

C++的内存管理

目录 1. C/C内存分布 2. C语言中动态内存管理方式 3. C内存管理方式 3.1 new/delete操作内置类型 4. operator new与operator delete函数 4.1 连续开辟空间(尽力了解) 5. new和delete的实现原理 5.1 内置类型 5.2 自定义类型 6. 深入理解 6.1malloc/free和new/delete的区…

探索多视角驱动的层次内容感知网络用于指静脉识别

文章目录 探索多视角驱动的层次内容感知网络用于指静脉识别总结摘要介绍相关工作多视角方法长短时记忆基于视角的目标表达 方法全局主干网络局部感知模块损失函数 实验和分析数据库实验设置和训练策略消融实验视角一致性的效果 参考文献 论文: Exploiting Multiperspective Dr…

小米相册提取表格选项消失解决方法

小米相册这次的提取表格选项消失 故障原因: 因为部分用户将小爱视觉(原名扫一扫)这个应用给卸载了导致 解决方法 应用商店下载 小爱视觉 安装后授权即可使用 注意:系统最好为最新的 Xiaomi HyperOS系统

抖音小店保证金是多少?怎么缴纳?最全的解答来了!

大家好,我是电商糖果 关于抖音小店的保证金,很多人并不太了解。 再加上保证金每年都会有变动,造成很多想开店的商家完全不懂,应该准备多少钱,以及如何缴纳? 这里糖果就给大家总结一下,想开店…

基于SSM+Jsp+Mysql的高校二手交易平台

基于SSMJspMysql的高校二手交易平台 基于SSMJspMysql的高校二手交易平台的设计与实现 开发语言:Java框架:ssm技术:JSPJDK版本:JDK1.8服务器:tomcat7数据库:mysql 5.7(一定要5.7版本&#xff0…

JetBrains全家桶激活,分享 GoLand 2024 激活的方案

大家好,欢迎来到金榜探云手! GoLand 公司简介 JetBrains 是一家专注于开发工具的软件公司,总部位于捷克。他们以提供强大的集成开发环境(IDE)而闻名,如 IntelliJ IDEA、PyCharm、和 GoLand等。这些工具被…

AI智能分析网关V4在非煤矿山安全生产视频智能监管场景中的应用

近年来,全国非煤矿山((含金属非金属矿山、尾矿库,以及矿泉水等其他矿山)安全生产工作取得明显成效,但安全基础仍然薄弱,事故总量仍然较大,重特大事故尚未得到根本遏制,安…

shell编程-jq命令详解

文章目录 前言一、jq简介1. 简介2. 语法3. 命令选项 二、用于处理json数据1. 过滤1.1 标识运算符1.2 基本过滤1.3 获取对象属性1.3 迭代数组元素1.4 获取数组元素1.5 使用运算符 2. 类型和值2.1 数组构造2.2 对象构造2.3 递归下降 3. 内置运算符和函数3.1 算术运算符3.2 函数3.…

外包干了20天,技术退步明显.......

先说一下自己的情况,大专生,21年通过校招进入杭州某软件公司,干了接近2年的功能测试,今年年初,感觉自己不能够在这样下去了,长时间呆在一个舒适的环境会让一个人堕落! 而我已经在一个企业干了2年的功能测试…

20240316-2-协同过滤(collaborative filtering)

协同过滤(collaborative filtering) 直观解释 协同过滤是推荐算法中最常用的算法之一,它根据user与item的交互,发现item之间的相关性,或者发现user之间的相关性,进行推荐。比如你有位朋友看电影的爱好跟你类似,然后最…

PublicCMS 后台模块 站点执行脚本RCE漏洞

PublicCMS是采用2023年主流技术开发的开源JAVACMS系统。由天津黑核科技有限公司开发,架构科学,轻松支撑上千万数据、千万PV;支持可视化编辑,多维扩展,全文搜索,全站静态化,SSI,动态页…

基于Spring Boot的拍卖管理系统设计与实现

摘 要 随着社会的发展,系统的管理形势越来越严峻。越来越多的用户利用互联网获得信息,但各种信息鱼龙混杂,信息真假难以辨别。为了方便用户更好的获得信息,因此,设计一种安全高效的拍卖管理系统极为重要。 为设计一个…

【Linux】Linux工具学习之gcc/g++

🔥博客主页: 小羊失眠啦. 🎥系列专栏:《C语言》 《数据结构》 《C》 《Linux》 《Cpolar》 ❤️感谢大家点赞👍收藏⭐评论✍️ 接上文,我们已经学习了 Linux 中的编辑器 vim 的相关使用方法,现在…

就业班 第二阶段 2401--3.19 day2 DDL DML DQL 多表查询

在mysql库里的语句 \G 竖着排列 ; \g 横着排列 数据库用户组成 双单引号单都行 -- sql的注释 创建mysql用户:(兼容5.7 8.0 ) create user root% identified by Qwer123..; grant all on *.* to root%; flush privileges; mysql 5.7 grant …

使用easyYapi生成文档

easyYapi生成文档 背景1.安装配置1.1 介绍1.2 安装1.3 配置1.3.1 Export Postman1.3.2 Export Yapi1.3.3 Export Markdown1.3.4 Export Api1.3.6 常见问题补充 2. java注释规范2.1 接口注释规范2.2 出入参注释规范 3. 特定化支持3.1 必填校验3.2 忽略导出3.3 返回不一致3.4 设置…

【单调队列】第十四届蓝桥杯省赛C++ C组 Java C组/研究生组 Python A组《子矩阵》(C++)

【题目描述】 给定一个 nm (n 行 m 列)的矩阵。 设一个矩阵的价值为其所有数中的最大值和最小值的乘积。 求给定矩阵的所有大小为 ab (a 行 b 列)的子矩阵的价值的和。 答案可能很大,你只需要输出答案对 998244353…

羽毛球移动步法训练

文章目录 简介训练量01 小颠步02 左右并步03 交叉步04 前后并步05 高抬腿06 高抬腿转髋07 左右移动跳08 并步跳09 前后小密步10 弓箭步跳11 开合跳参考文献 简介 本文参考:陈金羽毛球移动专项步法训练(BV1cS4y1V7xA)和颜叨叨的移动专项步法跟…

数据表练习

思维导图 面试题答问1、IO多路复用的引入目的和原理 目的:在有操作系统时,可以用多线程和进程完成任务并发执行,没有操作系统的情况下可以使用IO多路复用技术来进行任务并发。 原理:将多个阻塞任务的文件描述符统一放到一个检查容…

Qt 容器类控件

Group Box 使用 QGroupBox 实现一个带有标题的分组框可以把其他的控件放到里面作为一组,这样看起来能更好看一点. 核心属性 属性说明title分组框的标题alignment分组框内部内容的对齐方式flat是否是 “扁平” 模式checkable是否可选择. 设为 true,则在…