Vue 3和安装UUID演示
Vue 3和安装UUID演示
提问于 2021-08-19 15:21:20
我是新的Vue 3，正在寻找经常为Vue 2编写的与Vue 3不兼容的示例。在这个问题中，我在documentations github site上找不到任何关于UUID兼容性的信息。但假设随Vue 3安装的版本是正确的版本。
在使用npm安装了Vue 3之后，我通过运行"vue create myProject“创建了一个新项目。Hello World页面显示正确。然后使用"npm I vue- uuid“再次安装uuid，成功。
我按照uuid的github页面上的描述添加了代码。收到有关"use“未知的错误，因此修改了main.js代码，如下所示。现在我得到了一个错误，显示为“未捕获TypeError:无法设置未定义的属性'$uuid‘”。
我迷失了方向，想知道为什么要这么难？任何帮助都将不胜感激。
main.js
import { createApp } from 'vue'
import App from './App.vue'
//import Vue from "vue";
import UUID from "vue-uuid"
//Vue.use(UUID);
createApp(App).use(UUID).mount('#app')App.Vue
<template>
<div class="uuid-panel">
<h3 class="uuid">{{ uuid }}</h3>
<button class="button" @click="uuid = $uuid.v1()">Generate V1</button>
<button class="button" @click="uuid = $uuid.v3()">Generate V3</button>
<button class="button" @click="uuid = $uuid.v4()">Generate V4</button>
<button class="button" @click="uuid = $uuid.v5('Name 1', NAMESPACE)" >Generate V5</button>
</div>
</template>
<script>
import { uuid } from 'vue-uuid'
const NAMESPACE = "65f9af5d-f23f-4065-ac85-da725569fdcd"
export default {
name: 'App',
data () {
return {
NAMESPACE,
uuid: uuid.v1(),
v1: this.$uuid.v1(),
v3: this.$uuid.v3(),
v4: this.$uuid.v4(),
v5: this.$uuid.v5("Name 2", NAMESPACE)
};
}
}
</script>和package.json
"name": "myProject",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
},
"dependencies": {
"core-js": "^3.6.5",
"vue": "^3.0.0",
"vue-uuid": "^2.0.2"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.0.0"
}
}回答 1
Stack Overflow用户
回答已采纳
发布于 2021-08-19 19:47:10
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/68850528
复制相关文章
相似问题