最近在开发中，看到一个很有趣的插件-multiavatar，查看了一下官方，功能很强大，能够依据输入的内容，随机进行生成一个头像，觉得特别的有乐趣，特在这分享一下。
官方地址：multiavatar 官方地址
以下是 个人在 VUE 中写的一个简易 demo, 效果如下：
废话不多说，直接说下怎么在 vue 中使用。
1. npm 安装multiavatar
npm install @multiavatar/multiavatar -S
2. 简单的 一个 demo
<template><div><div class="avtart"><div v-html="avatar" class="avtart-block"></div></div><div class="input-block"><el-inputclass="input-text"v-model="userId"@input="changeInput"></el-input></div></div></template><script>import multiavatar from '@multiavatar/multiavatar'export default {components: {},data() {return {avatar: '',userId: ''}},watch: {},methods: {changeInput(value) {console.log('b', value)this.avatar = multiavatar(value)}}}</script><style lang="scss" scoped>.avtart-block {height: 300px;width: 300px;border-radius: 50%;margin-left: 460px;}.input-block {width: 100%;text-align: center;margin-top: 40px;.input-text {width: 300px;}}.avtart {width: 100%;text-align: center;}</style>
3. 在开发中学习中 ，这样多了很多的乐趣，感谢支持 🙏🙏
上一篇：第十二篇：VUE前端开发常用的正则表达式-封装js文件可直接引用
