Vue UUID

Background

因为在使用 vue-uuid 在 vue3 项目中会报错，果断修改原仓库

感谢🙏仓库原作者

Add UUID to Vue instance.

Install

Installation is very easy, you just need to install using NPM or Yarn.

1npm i vue3-uuid

Vue's use method will do the trick adding to Vue.

1import { createApp } from 'vue'
2import App from './App.vue'
3import UUID from "vue3-uuid";
4const app = createApp(App)
5app.use(UUID)
6

Usage

1<template>
2  <div class="uuid-panel">
3    <h3 class="uuid">{{ UUID }}</h3>
4    <button
5      class="button"
6      @click="choose"
7    >Generate V1</button>
8    <button
9      class="button"
10      @click="choose(3)"
11    >Generate V3</button>
12    <button
13      class="button"
14      @click="choose(4)"
15    >Generate V4</button>
16    <button
17      class="button"
18      @click="choose(5)"
19    >Generate V5</button>
20  </div>
21</template>
22
23<script setup>
24  import { ref } from 'vue'
25  import { uuid } from 'vue-uuid';
26  const NAMESPACE = "65f9af5d-f23f-4065-ac85-da725569fdcd";
27
28  const UUID = ref(null);
29  const choose = ( type ) => {
30    if ( type === 3 ) {
31      UUID.value =  uuid.v3();
32    } else if ( type === 4) {
33      UUID.value = uuid.v4();
34    } else if ( type === 5 ) {
35      UUID.value = uuid.v5("Name 1", NAMESPACE);
36    } else {
37       UNID.value = uuid.v1();
38    }
39  }
40</script>