vue中实现点击元素随机切换大写字母数字四位数组合

最新推荐文章于 2024-08-14 15:58:05 发布

weixin_49203377

最新推荐文章于 2024-08-14 15:58:05 发布

阅读量424

点赞数 1

分类专栏： vue遇到的问题 js 文章标签： vue.js javascript

本文链接：https://blog.csdn.net/weixin_49203377/article/details/129186408

版权

vue遇到的问题同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

10 篇文章 0 订阅

订阅专栏

html中

  <div @click="createCode">{{abc}}</div>

data中定义abc初始字段

 data() {
    return {
      abc:"CS98"
    };
  },

点击时候调用的方法

  methods: {
    createCode() {
	var abc;
//首先默认abc为空字符串
	abc = '';
//设置长度，这里看需求，这里设置的是4位
	var codeLength = 4;
//设置随机字符
var random = new Array( 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z',0, 1, 2, 3, 4, 5, 6, 7, 8, 9,);
//循环codeLength 设置的4就循环4次
for (var i = 0; i < codeLength; i++) {
//设置随机数范围为0 ~ 36
	var index = Math.floor(Math.random() * 36);
//字符串拼接每次随机的字符进行一次拼接
	abc += random[index];
}
//将拼好的字符串赋值给abc
this.abc=abc
},
  },