Vue3 前端生成随机id( 生成 UUID )

news2025/1/12 1:51:07

效果展示

在这里插入图片描述

封装工具(代码展示)

重新创建一个文件**/utils/someTools.js**,并在里面写入如下代码。

function Tools() {

}

Tools.prototype.guid = function () {
  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
    var r = Math.random() * 16 | 0,
        v = c == 'x' ? r : (r & 0x3 | 0x8);
    return v.toString(16);
  });
}

const tools = new Tools();
export default tools;

实际运用-----SomeTools.guid()

随机打开一个你想要生成id的文件,先引入文件,然后调用**guid()**方法。

import { ref } from 'vue'
import SomeTools from '@/utils/someTools.js' 
 
//直接这样就可以使用啦
//SomeTools.guid()

//可以直接赋值使用,例如:
const id = ref(null)
id.value = SomeTools.guid()

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

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

相关文章

Android SDK 开发 云托管

开发SDK,拒绝重复造轮子。 本文陈述两种SDK开发方式,第一种AAR方式;第二种远程依赖方式。 具体步骤分为: 一、如何开发SDK? 二、如何打包AAR? 三、如何打包AAR? 四、如何进行SDK远程托管? 五、如…

工业物联网平台在水务环保、暖通制冷、电力能源等行业的应用

随着科技的不断发展,工业物联网平台作为连接物理世界与数字世界的桥梁,正逐渐成为推动各行业智能化转型的关键力量。在水务环保、暖通制冷、电力能源等行业,工业物联网平台的应用尤为广泛,对于提升运营效率、降低能耗、优化管理等…

toJSONString空值被忽略解决办法 toJSONString过程中时间格式丢失问题解决办法

toJSONString空值被忽略解决办法 原代码: GcGarbageBuildingDO data gcGarbageBuildingService.get(id); result.putAll(JSON.parseObject(JSON.toJSONString(data), Map.class));查询出来的data中部分字段值为null,在toJSONString的过程中会把null值…

基于STM32的感应开关垃圾桶

1.定时器介绍 1.1 工作原理 使用精准的时基,通过硬件的方式,实现定时功能。 1.2 定时器分类 基本定时器(TIM6~TIM7)通用定时器(TIM2~TIM5)高级定时器(TIM1和TIM8) 1.3 通用定时器…

【C语言】Windows下的C语言线程编程详解

文章目录 1. 头文件1.1 windows.h1.2 process.h 2. 创建线程3. 线程同步3.1 线程同步方式3.1 互斥量(Mutex)3.2 事件(Event) 4. 线程的结束与资源管理5.线程池(简要) 在Windows平台下,C语言提供…

隧道技术和代理技术(三)

隧道技术 知识点 -隧道技术:解决不出网协议上线的问题(利用出网协议进行封装出网) -代理技术:解决网络通讯不通的问题(利用跳板机建立节点后续操作) 内环境示意图,方便理解 思路:…

【网络原理】UDP协议的详细解析

文章目录 🎄UDP协议概念🌲UDP协议端格式🎄UDP的特点🌸无连接🌸不可靠传输🌸面向数据报🌸缓冲区🌸全双工🌸大小受限 🍀基于UDP的应用层协议🎍扩展问…

(BAT向)Java岗常问高频面试汇总:MyBatis 微服务 Spring 分布式 MySQL等

看面试题可以是为了面试,也可以是对自己学到的东西的一种查漏补缺,更加深刻的去了解一些核心知识点 Spring面试高频问题 问题一:谈 需要zi料 绿色徽【vip1024b】 谈你对spring IOC 和 DI 的理解,它们有什么区别? **问题…

全球首个AI程序员Devin诞生,真的不再需要程序员了吗?

前言 今年到底是怎么回事?前有Sora(首个文生视频大模型)独领风骚,后有Mistral(号称世界第二语言大模型)横刀立马,甚至Claude3的热度都还没有过,今天一则更炸裂的消息就爆出,世界上第一个AI程序…

代码贴--链表--数据机构

本博客将记录链表代码(单链表)&#xff0c;后续其他链表和其他数据结构内容请看我的其他博客 头文件(SList.h) #pragma once #include<iostream> #include<bits/stdc.h> using namespace std;typedef int SLTDataType;struct SListNode {int data;struct SListNo…

windows系统玩游戏找不到d3dx9_43.dll缺失,无法启动此程序的解决方法

今日&#xff0c;我们要深入讨论d3dx9_43.dll文件的重要性及其缺失问题。最近&#xff0c;我也遇到了这个文件丢失的困扰&#xff0c;因此想借此机会与大家分享如何解决d3dx9_43.dll缺失的问题。 一.电脑d3dx9_43.dll丢失会提示什么&#xff1f; 关于电脑提示d3dx9_43.dll丢失…

【人力资源开发】某主题公园人力资源开发管理咨询项目纪实

虽然很多企业将“人事部”改为“人力资源部”&#xff0c;但是企业的人力资源管理水平却仍停留在“人事管理”的阶段。该主题公园也是如此。随着公园的不断发展&#xff0c;其人力资源管理问题逐渐显露&#xff0c;而管理者也不清楚问题的根源在哪里&#xff0c;只能采取“头疼…

AWS入门实践-AWS CLI工具的使用介绍

AWS CLI&#xff08;Amazon Web Services Command Line Interface&#xff09;是一个强大的工具&#xff0c;它允许您直接从命令行与AWS服务进行交互。这不仅可以加快许多任务的处理速度&#xff0c;而且还可以通过脚本自动化。 一、AWS CLI工具的安装 1、Windows 安装下载…

java-双列集合

什么是双列集合&#xff1f; 集合中每次存的数据是成对存入的 以及它的特点是什么&#xff1f; 特别注意&#xff1a;键不可重复&#xff0c;值可以 Map是双列集合的顶层接口 Map 它有哪些方法呢&#xff1f; Map的常用API 添加 添加操作的代码如下 我们要明白一些细节&…

【项目笔记】java微服务:黑马头条(day02)

文章目录 app端文章查看&#xff0c;静态化freemarker,分布式文件系统minIO1)文章列表加载1.1)需求分析1.2)表结构分析1.3)导入文章数据库1.3.1)导入数据库1.3.2)导入对应的实体类 1.4)实现思路1.5)接口定义1.6)功能实现1.6.1)&#xff1a;导入heima-leadnews-article微服务&am…

C++初阶:内存管理

目录 1. C/C中各种资源的内存分布1.1 C/C程序内存区域划分1.2 各资源的内存分布情况&#xff08;练习&#xff09; 2. C中的动态内存管理方式2.1 new/delete开辟内置类型空间2.2 new/delete开辟销毁自定义类型空间 3. operator new 与 operator delete函数4. new与delete的实现…

逆变器功率软起斜率要求

安规说明 在NB32004中&#xff0c;有明确要求&#xff0c;有功功率调整速率不得超过正负10%Pn/min&#xff0c;包括起停机。 控制对象 控制功率最终是通过调整D轴电流给定来达到限制功率的目的&#xff0c;所以我们只要让D轴的电流给定限幅值按照10%/min增加就好了。 具体实…

openAI key 与ChatGPTPlus的关系,如何升级ChatGPTPLus

一、前言 先详细介绍一下Plus会员和Open API之间的区别&#xff1a; 实际上&#xff0c;这两者是相互独立的。举例来说&#xff0c;虽然您开通了Plus会员&#xff0c;并不意味着您就可以使用4.0版本的API。尽管这两个账户可以是同一个&#xff0c;但它们是完全独立的平台。 …

ChatGPT提问技巧:可解释的软提示

ChatGPT提问技巧&#xff1a;可解释的软提示 可解释的软提示是一种既能控制模型生成的文本&#xff0c;又能为模型提供一定灵活性的技术。 具体做法是为模型提供一组受控输入和一些有关所需输出的附加信息。这种技术可以使生成的文本更具可解释性和可控性。 提示示例及其公式…

DAY by DAY 史上最全的Linux常用命令汇总----man

man是按照手册的章节号的顺序进行搜索的。 man设置了如下的功能键&#xff1a; 功能键 功能 空格键 显示手册页的下一屏 Enter键 一次滚动手册页的一行 b 回滚一屏 f 前滚一屏 q 退出man命令 h 列出所有功能键 /word 搜索word字符串 注意&#xff1a…