From 20b763101830cdb5ab54eccc7b93c5dfde1774fb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E9=BA=BB=E5=A6=9E?=
 <50100681+jiangmaniu@users.noreply.github.com>
Date: Sat, 24 Jul 2021 20:51:23 +0800
Subject: [PATCH 1/2] fix: Fix the problem that the QR code cannot be
 dynamically generated

---
 src/components/Qrcode/src/Qrcode.vue | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/components/Qrcode/src/Qrcode.vue b/src/components/Qrcode/src/Qrcode.vue
index beb80ad52d4..3c5c2763723 100644
--- a/src/components/Qrcode/src/Qrcode.vue
+++ b/src/components/Qrcode/src/Qrcode.vue
@@ -4,7 +4,7 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, watchEffect, PropType, ref, unref } from 'vue';
+  import { defineComponent, watch, PropType, ref, unref } from 'vue';
   import { toCanvas, QRCodeRenderersOptions, LogoType } from './qrcodePlus';
   import { toDataURL } from 'qrcode';
   import { downloadByUrl } from '/@/utils/file/download';
@@ -93,11 +93,16 @@
         });
       }
 
-      watchEffect(() => {
-        setTimeout(() => {
-          createQrcode();
-        }, 30);
-      });
+      // 监听参数变化重新生成二维码
+      watch(
+        props,
+        () => {
+          createQrcode()
+        },
+        {
+          deep: true,
+        }
+      )
 
       return { wrapRef, download };
     },

From 827c258687d10a7d43b9471ddccf06d5c8cb0dd4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B1=9F=E9=BA=BB=E5=A6=9E?=
 <50100681+jiangmaniu@users.noreply.github.com>
Date: Sat, 24 Jul 2021 20:52:24 +0800
Subject: [PATCH 2/2] Fix the problem that the size of the QR code is
 automatically changed when dynamically generated

---
 src/components/Qrcode/src/drawCanvas.ts | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/Qrcode/src/drawCanvas.ts b/src/components/Qrcode/src/drawCanvas.ts
index 67fc4c87ad0..e8416369329 100644
--- a/src/components/Qrcode/src/drawCanvas.ts
+++ b/src/components/Qrcode/src/drawCanvas.ts
@@ -1,7 +1,15 @@
 import { toCanvas } from 'qrcode';
 import type { QRCodeRenderersOptions } from 'qrcode';
 import { RenderQrCodeParams, ContentType } from './typing';
-export const renderQrCode = ({ canvas, content, width = 0, options = {} }: RenderQrCodeParams) => {
+import { cloneDeep } from 'lodash-es';
+
+export const renderQrCode = ({
+  canvas,
+  content,
+  width = 0,
+  options: params = {}
+}: RenderQrCodeParams) => {
+  const options = cloneDeep(params)
   // 容错率，默认对内容少的二维码采用高容错率，内容多的二维码采用低容错率
   options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content);