Math.random()实现验证码功能

        <div class="Text">
          <div class="TextTitle">验证码：</div>
          <Input
            v-model="codevalue"
            placeholder="请输入验证码"
            style="width: 100px"
          />
          <div class="CodeBox" @click="GetCode">
            <div class="Code">{{ str }}</div>
          </div>
        </div>

data() {
    return {
      str: "",
      codeStr: "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789",
    };
  },
  mounted() {
    this.GetCode();
  },
  methods: {
    //   获取随机数
    getRandom(n, m) {
      // param: (Number, Number)
      n = Number(n);
      m = Number(m);
      // 确保 m 始终大于 n
      if (n > m) {
        var temp = n;
        n = m;
        m = temp;
      }
      return Math.floor(Math.random() * (m - n) + n);
    },
    GetCode() {
      this.str = "";
      for (var i = 0; i < 4; i++) {
        var ran = this.getRandom(0, 62);
        this.str += this.codeStr.charAt(ran);
      }
    },
    Login() {},
  },

.Code {
  width: 110px;
  margin: 0 auto;
  font-size: 20px;
  letter-spacing: 13px;
  background: linear-gradient(45deg, red, #03a9f4, black);
  background-clip: text;
  cursor: pointer;
  //禁止复制
  user-select: none;
}