图文验证：使用canvas(3)

<template>
  <div>
    <h3>图文验证：使用canvas(3)</h3>
    <div @click="getRefreshCodeFun">
      <verify
        :verifyCode="verifyCode"
        :verifyCodes="verifyCodes"
        style="cursor: pointer"
      ></verify>
    </div>
  </div>
</template>

<script>
import verify from "./verifyDemo.vue";
export default {
  name: "index",
  components: {
    verify,
  },
  data() {
    return {
      verifyCode: "",
      // 验证码规则
      verifyCodes: "123456789ABCDEFGHGKMNPQRSTUVWXYZ",
    };
  },
  methods: {
    // 切换验证码
    getRefreshCodeFun() {
      this.verifyCode = "";
      this.getrandomCode(this.verifyCodes, 4);
      console.log(this.verifyCode);
    },
    // 生成随机验证码
    getrandomCode(o, l) {
      for (let i = 0; i < l; i++) {
        this.verifyCode +=
          this.ve