react 组件实战之 验证码

主要功能:

• 随机生成4个 大 / 小写英文字母 / 阿拉伯数字
• 随机干扰线防止机器轻松破解
• 点击刷新验证码
• dom 结构优化

验证码一定是人类史上比较伟大的发明，坑了机器人也坑了自己。


来有兴趣的小伙伴请留言验证码输入答案！！

言归正传，验证码的功能主要是

不被机器轻松破解

人眼很好识别

完整代码: https://github.com/zzzzhaoziyi/react-Vcode
效果预览

第一步随机生成4个 大 / 小写英文字母 / 阿拉伯数字

  getRandom(max, min, num) {
    const asciiNum = ~~(Math.random()*(max-min+1)+min)
    if(!Boolean(num)){
      return asciiNum
    }
    const arr = []
    for(let i = 0; i < num; i++){
      arr.push(this.getRandom(max, min