vue3 hook库

import { ElNotification } from "element-plus";
/*** @description 接收数据流生成 blob,创建链接,下载文件* @param {any} data 导出的文件blob数据 (必传)* @param {String} tempName 导出的文件名 (必传)* @param {Boolean} isNotify 是否有导出消息提示 (默认为 true)* @param {String} fileType 导出的文件格式 (默认为.xlsx)* */
interface useDownloadParam {data: any;tempName: string;isNotify?: boolean;fileType?: string;
}export const useDownload = async ({ data, tempName,isNotify = true, fileType = ".xlsx" }: useDownloadParam) => {if (isNotify) {ElNotification({title: "温馨提示",message: "如果数据庞大会导致下载缓慢哦,请您耐心等待!",type: "info",duration: 3000});}try {const blob = new Blob([data]);// 兼容 edge 不支持 createObjectURL 方法if ("msSaveOrOpenBlob" in navigator) return window.navigator.msSaveOrOpenBlob(blob, tempName + fileType);const blobUrl = window.URL.createObjectURL(blob);const exportFile = document.createElement("a");exportFile.style.display = "none";exportFile.download = `${tempName}${fileType}`;exportFile.href = blobUrl;document.body.appendChild(exportFile);exportFile.click();// 去除下载对 url 的影响document.body.removeChild(exportFile);window.URL.revokeObjectURL(blobUrl);} catch (error) {console.log(error);}
};
import { cloneDeep } from 'lodash-es'export default function useCustomReactive<T extends object>(obj: T) {const initState = cloneDeep(obj)const state = reactive<T>(obj)function reset() {for (const key in state) {state[key] = initState[key as string]}}return { state, reset }
}
export default function useDisableLabelForSwitch() {onMounted(() => {nextTick(() => {const arr = document.querySelectorAll('.el-switch input')arr.forEach(el => {console.log('禁用switch label for关联')el?.removeAttribute('id')})})})
}
import { onMounted, type Ref, ref } from 'vue'interface HookOptions<P = any, D = any> {/*** 是否自动请求,为true时,将在onMounted钩子自动执行一次getData*/auto?: booleanloading?: Ref<boolean>params?: Psuccess?: (res: D | undefined) => void
}/*** 默认参数*/
const defaultOptions: HookOptions = {auto: false
}type FunctionParams<T> = T extends (arg: infer P) => any ? P : nevertype ApiResult<T extends PromiseFn> = PromiseValue<ReturnType<T>>export default function useRequest<API extends PromiseFn,D extends FunctionParams<API>
>(api: API, options?: HookOptions<D, ApiResult<API>>) {options = { ...defaultOptions, ...options }const loading = ref(false)const data = ref<PromiseValue<ReturnType<API>>>()// 切换loading状态function toggleLoading(flag: boolean) {loading.value = flag// 如果设置了自定义loading属性,则一起切换if (options?.loading !== undefined) {options.loading.value = flag}}// 获取数据async function request(params?: Partial<FunctionParams<API>>): Promise<PromiseValue<ReturnType<API>>> {toggleLoading(true)try {const res = await api({...options?.params,...params})if (options?.success) {options.success(res)}data.value = resreturn res} catch (err) {throw err} finally {toggleLoading(false)}}onMounted(() => {if (options?.auto) {request()}})return {loading,data,request}
}

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

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

相关文章

今日定音,博通以610亿美元成功收购VMware | 百能云芯

博通&#xff08;Broadcom&#xff09;日前宣布&#xff0c;已获得中国监管机构的批准&#xff0c;将于今日完成对云计算公司VMware的收购交易。这意味着&#xff0c;610亿美元的收购案正式收关。 据悉&#xff0c;中国市场监管总局在11月21日晚发布了有关附加限制性条件批准博…

Python-大数据分析之常用库

Python-大数据分析之常用库 1. 数据采集与第三方数据接入 1-1. Beautiful Soup ​ Beautiful Soup 是一个用于解析HTML和XML文档的库&#xff0c;非常适用于网页爬虫和数据抓取。可以提取所需信息&#xff0c;无需手动分析网页源代码&#xff0c;简化了从网页中提取数据的过…

2023亚太杯数学建模A题B题C题思路模型代码论文指导

2023亚太地区数学建模A题思路&#xff1a;开赛后第一时间更新&#xff0c;获取见文末 名片 2023亚太地区数学建模B题思路&#xff1a;开赛后第一时间更新&#xff0c;获取见文末 名片 2023亚太地区数学建模C题思路&#xff1a;开赛后第一时间更新&#xff0c;获取见文末 名片…

排序算法--冒泡排序

实现逻辑 ① 比较相邻的元素。如果第一个比第二个大&#xff0c;就交换他们两个。 ②对每一对相邻元素作同样的工作&#xff0c;从开始第一对到结尾的最后一对。在这一点&#xff0c;最后的元素应该会是最大的数。 ③针对所有的元素重复以上的步骤&#xff0c;除了最后一个。 ④…

centos7 网卡聚合bond0模式配置

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 一、什么是网卡bond二、网卡bond的模式三、配置bond0 一、什么是网卡bond 所谓bond&#xff0c;就是把多个物理网卡绑定成一个逻辑上的网卡&#xff0c;使用同一个…

HTML5 怎么发布抖音小游戏

要发布 HTML5 抖音小游戏&#xff0c;可以按照以下步骤进行操作&#xff1a; 准备游戏&#xff1a;确保你的 HTML5 游戏已经开发完成&#xff0c;并且测试无误。注册抖音账号&#xff1a;如果你还没有抖音账号&#xff0c;需要先注册一个。可以使用手机号、微信或者第三方账号…

Java update scheduler

引言 Java 更新调度器是 Java 中的一个特性&#xff0c;可以自动化 Java 应用程序的更新过程。它提供了一种方便的方式来安排 Java 应用程序的更新&#xff0c;确保其与最新的功能、错误修复和安全补丁保持同步。本文将深入介绍如何使用 Java 更新调度器&#xff0c;并解释它对…

威胁攻击层出不穷,信息化负责人该如何增强对抗与防御能力?

11月15日&#xff0c;以“加快推进智慧校园建设 赋能为党育才为党献策”为主题的2023年华东地区党校&#xff08;行政学院&#xff09;信息化和图书馆工作高质量发展专题研讨班顺利举办。 作为国内云原生安全领导厂商&#xff0c;安全狗受邀出席活动。 厦门服云信息科技有限公…

腾讯云服务器99元一年是真的吗?假的!

腾讯云服务器99元一年是真的吗&#xff1f;假的&#xff0c;不用99元&#xff0c;只要88元即可购买一台2核2G3M带宽的轻量应用服务器&#xff0c;99元太多了&#xff0c;88元就够了&#xff0c;腾讯云百科活动 txybk.com/go/txy 活动打开如下图&#xff1a; 腾讯云轻量服务器 腾…

扒一扒Bean注入到Spring的那些姿势

这篇文章我准备来扒一扒Bean注入到Spring的那些姿势。 其实关于Bean注入Spring容器的方式网上也有很多相关文章&#xff0c;但是很多文章可能会存在以下常见的问题 注入方式总结的不全 没有分析可以使用这些注入方式背后的原因 没有这些注入方式在源码中的应用示例 ... 所…

Navicat 下载

1 中文网站 Navicat 中国 | 支持 MySQL、Redis、MariaDB、MongoDB、SQL Server、SQLite、Oracle 和 PostgreSQL 的数据库管理 下载链接&#xff1a; https://download.navicat.com.cn/download/navicat163_premium_cs_x86.exe 2 下载其他版本(找到发行说明--版本号--替换版本…

spring boot项目未将resource目录标志为资源目录导致配置文件无效因而运行报错问题

能编译&#xff0c;但不能运行。感觉配置文件没有生效。 将程序代码发给同事&#xff0c;我自己能跑&#xff0c;他不能跑&#xff0c;提示无法构造redis对象。redis的链接写在配置文件里&#xff0c;其实是可以连接的。然后从GIT库下载代码&#xff0c;也同样不能跑。同事的操…

某高品质房产企业:借助NineData平台,统一数据库访问权限,保障业务安全

该企业是中国领先的优质房产品开发及生活综合服务供应商。在 2022 年取得了亮眼的业绩表现&#xff0c;销售额市场占有率跻身全国前五。业务涵盖房产开发、房产代建、城市更新、科技装修等多个领域。 2023 年&#xff0c;该企业和玖章算术&#xff08;浙江&#xff09;科技有限…

连线长光卫星:吉林一号的在线产品与生态体系!

我们在《连线长光卫星&#xff1a;探索卫星应用的更多可能&#xff01;》一文中&#xff0c;通过直播连线嘉宾的分享&#xff0c;让大家了解到了长光卫星的生产基地、三次技术飞跃、亚米级影像产品、150公里大幅宽卫星、卫星在灾害监测及经济分析等多个场景中的应用。 这里我们…

Midjourney绘画提示词Prompt参考教程

Midjourney绘画提示词Prompt参考教程&#xff1a;无需魔法使用。 一、AI工具 SparkAi&#xff1a; SparkAi创作系统是基于OpenAI很火的ChatGPT进行开发的Ai智能问答系统和Midjourney绘画系统&#xff0c;支持OpenAI-GPT全模型国内AI全模型。本期针对源码系统整体测试下来非常…

ProPresenter 7 for Mac:Mac电脑好用的文稿演示软件

ProPresenter 7是一款专业的多媒体演示软件&#xff0c;主要用于创建和展示高质量的教堂媒体演示、音乐歌词、幻灯片和视频等。它是一款功能强大且易于使用的软件&#xff0c;被广泛应用于教堂、会议、演唱会和其他场合。以下是ProPresenter 7的一些主要特点和功能&#xff1a;…

springboot设置时区

问题&#xff1a;实体类Date类型&#xff0c;数据库使用的datetime类型&#xff0c;插入和查询的时间存在时差。 设置数据库url serverTimezoneGMT%2B8配置yml spring:jackson:date-format: yyyy-MM-dd HH:mm:sstime-zone: GMT8注&#xff1a;实体类无需配置JsonFormat //Jso…

window上Clion配置C++版本的opencv

window上Clion配置opencv 注意版本一定要对的上&#xff0c;否则可能会出错&#xff0c;亲测 widnows 11mingw 8.1.0opencv 4.5.5 mingw8.1下载地址https://sourceforge.net/projects/mingw/ 配置环境变量 cmake下载 安装完添加环境变量 来到官网&#xff0c;下载 windows 对…

GNU工具链

1. GNU介绍 工具链典型的例子就是GNU工具链。 GNU工具链是由GNU项目产生的各种编程工具的集合&#xff0c;用于开发应用程序与操作系统。 GNU工具链在针对嵌入式系统的Linux内核、BSD及其它软件的开发中起着至关重要的作用。 GNU工具链中的部分工具也被Mac OS X, Microsoft W…

【C++】类和对象一

今天来到了类和对象部分&#xff0c;我们知道C语言是面向过程编程&#xff0c;而C是面向对象编程&#xff0c;那么怎么个具体实现方法呢&#xff1f;简单来说&#xff0c;就是C语言对结构体的定义和对结构体的操作是分开的&#xff0c;这样就显得过程很独立&#xff1b;而C是把…