diff --git a/CHANGELOG.md b/CHANGELOG.md index 90d585a8..934b2e5d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # CHANGE LOG +## 4.2.3 + +### Fixes + +- 修复 RQRCode 组件不能正确的监听 text 属性变化而重新渲染问题 + ## 4.2.2 重构了 RTable 组件。优化表格渲染逻辑,解决旧组件重复渲染问题。并且允许自定义拓展工具栏。 diff --git a/package.json b/package.json index c5a6cd23..abe51f55 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ray-template", "private": false, - "version": "4.2.2", + "version": "4.2.3", "type": "module", "engines": { "node": ">=16.0.0", diff --git a/src/components/RQRCode/src/index.tsx b/src/components/RQRCode/src/index.tsx index 7f92132b..8f44b989 100644 --- a/src/components/RQRCode/src/index.tsx +++ b/src/components/RQRCode/src/index.tsx @@ -20,6 +20,7 @@ import { isValueType, downloadAnyFile } from '@use-utils/hook' import { call } from '@/utils/vue/index' import type { QRCodeRenderResponse, GIFBuffer } from './type' +import type { WatchStopHandle } from 'vue' const readGIFAsArrayBuffer = (url: string): Promise => { return new Promise((resolve, reject) => { @@ -59,6 +60,7 @@ export default defineComponent({ opacitySpinning: '0.1', } let gifBuffer: GIFBuffer + let watchCallback!: WatchStopHandle const getGIFImageByURL = async () => { const { gifBackgroundURL } = props @@ -123,9 +125,10 @@ export default defineComponent({ watchEffect(() => { if (props.watchText) { - nextTick().then(() => { - renderQRCode() - }) + watchCallback = watch( + () => props.text, + () => renderQRCode(), + ) } }) @@ -137,6 +140,9 @@ export default defineComponent({ await getGIFImageByURL() renderQRCode() }) + onBeforeUnmount(() => { + watchCallback && watchCallback() + }) return { qrcodeURL,