随机生成id——uuid

不取名字的码农。

已于 2024-01-10 20:56:58 修改

阅读量589

点赞数 11

CC 4.0 BY-SA版权

文章标签： vue.js 前端

于 2024-01-10 20:32:38 首次发布

本文链接：https://blog.youkuaiyun.com/Adios_0403/article/details/135512135

本文介绍了如何在VScode中通过终端安装并引入nanoid库，以便在Vue组件中生成唯一的id。作者提供了使用nanoid的代码片段和一个简单的MyHeader组件实例，展示了如何在组件的方法中利用nanoid生成todo对象的id。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.在VScode打开终端安装

npm i nanoid
在这里插入图片描述

2.按需引入nanoid中的nanoid即可

import {nanoid} from 'nanoid'

3.使用nanoid

const todoObj = {id:nanoid(),title:this.title,done:false}

4.举例：

<script>
import {nanoid} from 'nanoid'
   export default {
   name:'MyHeader',
   data() {
      return {
         title:''
      }
   },
   methods:{
      add(e) {
         // 将用户的输入包装成一个todo对象
         const todoObj = {id:nanoid(),title:this.title,done:false}
         
      }
   }
   }
</script>