vue3简易文字验证码

大神勿喷,简易版本,demo中可以用一下。

需要几个文字自己codelen 赋值 灵活点直接父组件传过去,可以自己改造vue3简易文字验证码_第1张图片

首先创建一个生成数字的js

**mathcode.js**

function MathCode(num){
        let str = "寻寻觅觅冷冷清清凄凄惨惨戚戚乍暖还寒时候最难将息三杯两盏淡酒怎敌他晚来风急雁过也正伤心却是旧时相识满地黄花堆积憔悴损如今有谁堪摘守着窗儿独自怎生得黑梧桐更兼细雨到黄昏点点滴滴这次第怎一个愁字了得";
        let arr = str.split("");
        let lastcoe =  getArrayItems(arr,num) 
        return lastcoe;
}


//随机生成指定个数的字符
 function getArrayItems(arr, num) {
    var temp_array = new Array();
    for (var index in arr) {
        temp_array.push(arr[index]);
    }
    var return_array = new Array();
    for (var i = 0; i0) {
            var arrIndex = Math.floor(Math.random()*temp_array.length);
            return_array[i] = temp_array[arrIndex];
            temp_array.splice(arrIndex, 1);
        } else {    
            break;
        }
    }
    return return_array;
}

 export { MathCode }

组件如下TextCode.vue




  

  
  

使用方式在页面中引入

import TextCode from "./TextCode.vue";

例如 login.vue







你可能感兴趣的:(javascript,前端,vue.js)