From 3cc55d4e649f187adedf2a614f125fb92fa2b1bc Mon Sep 17 00:00:00 2001
From: Chuan Zh <zhchuan7@gmail.com>
Date: Fri, 1 Apr 2022 14:06:23 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81=E9=95=BF=E6=8C=89?=
 =?UTF-8?q?=E8=AF=86=E5=88=AB=E4=BA=8C=E7=BB=B4=E7=A0=81=20fix=20#56=20(#5?=
 =?UTF-8?q?7)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../taro-code/src/components/QRCode/index.tsx | 88 ++++++++++++-------
 1 file changed, 54 insertions(+), 34 deletions(-)

diff --git a/packages/taro-code/src/components/QRCode/index.tsx b/packages/taro-code/src/components/QRCode/index.tsx
index 40c774e..9e763d9 100644
--- a/packages/taro-code/src/components/QRCode/index.tsx
+++ b/packages/taro-code/src/components/QRCode/index.tsx
@@ -1,4 +1,4 @@
-import React, { CSSProperties, useMemo } from 'react'
+import React, { CSSProperties, useMemo, forwardRef, useImperativeHandle } from 'react'
 import { Image } from '@tarojs/components'
 import { createQrCodeImg } from '../../common/qrcode'
 
@@ -44,7 +44,9 @@ type TypeNumber =
   | 39
   | 40
 
-const QRCode: React.FC<{
+const QRCode = forwardRef<
+{ image: string },
+{
   className?: string
   text: string
   size?: number
@@ -54,39 +56,57 @@ const QRCode: React.FC<{
   typeNumber?: TypeNumber
   foregroundColor?: string
   backgroundColor?: string
-}> = ({
-  className,
-  text = '',
-  size = 100,
-  scale = 4,
-  typeNumber = 2,
-  errorCorrectLevel = 'M',
-  style = {},
-  foregroundColor = '#000000',
-  backgroundColor = '#FFFFFF'
-}) => {
-  const image = useMemo(() => {
-    const options = {
+  showMenuByLongpress?: boolean
+}
+>(
+  (
+    {
+      className,
+      text = '',
+      size = 100,
+      scale = 4,
+      typeNumber = 2,
+      errorCorrectLevel = 'M',
+      style = {},
+      foregroundColor = '#000000',
+      backgroundColor = '#FFFFFF',
+      showMenuByLongpress
+    },
+    ref
+  ) => {
+    const image = useMemo(() => {
+      const options = {
+        errorCorrectLevel,
+        typeNumber,
+        size: size * scale,
+        black: foregroundColor,
+        white: backgroundColor
+      }
+      return createQrCodeImg(text, options)
+    }, [
       errorCorrectLevel,
       typeNumber,
-      size: size * scale,
-      black: foregroundColor,
-      white: backgroundColor
-    }
-    return createQrCodeImg(text, options)
-  }, [
-    errorCorrectLevel,
-    typeNumber,
-    size,
-    scale,
-    foregroundColor,
-    backgroundColor,
-    text
-  ])
-  const widthString = size != null ? `${size}px` : ''
-  const heightString = size != null ? `${size}px` : ''
-  const finalStyle = { width: widthString, height: heightString, ...style }
-  return <Image className={className} style={finalStyle} src={image} />
-}
+      size,
+      scale,
+      foregroundColor,
+      backgroundColor,
+      text
+    ])
+    const widthString = size != null ? `${size}px` : ''
+    const heightString = size != null ? `${size}px` : ''
+    const finalStyle = { width: widthString, height: heightString, ...style }
+    useImperativeHandle(ref, () => {
+      return { image }
+    }, [image])
+    return (
+      <Image
+        className={className}
+        style={finalStyle}
+        src={image}
+        showMenuByLongpress={showMenuByLongpress}
+      />
+    )
+  }
+)
 
 export default QRCode