chore: 修改injectCatchEvent事件

didi · Nov 5, 2024 · e2b0511 · e2b0511
1 parent 85a1dca
commit e2b0511
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 24 deletions.
diff --git a/packages/webpack-plugin/lib/runtime/components/react/getInnerListeners.ts b/packages/webpack-plugin/lib/runtime/components/react/getInnerListeners.ts
@@ -105,25 +105,6 @@ export const getCustomEvent = (
   }
 }
 
-export const injectCatchEvent = (props: Record<string, any>) => {
-  const eventHandlers: Record<string, any> = {}
-  const catchEventList = [
-    { name: 'onTouchStart', value: ['catchtouchstart'] },
-    { name: 'onTouchMove', value: ['catchtouchmove', 'catchvtouchmove', 'catchvhouchmove'] },
-    { name: 'onTouchEnd', value: ['catchtouchend'] }
-  ]
-  catchEventList.forEach(event => {
-    event.value.forEach(name => {
-      if (props[name] && !eventHandlers[event.name]) {
-        eventHandlers[event.name] = (e: NativeSyntheticEvent<TouchEvent>) => {
-          e.stopPropagation()
-        }
-      }
-    })
-  })
-  return eventHandlers
-}
-
 const useInnerProps = (
   props: Props = {},
   additionalProps: AdditionalProps = {},

diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-movable-view.tsx
@@ -19,10 +19,10 @@
  */
 import { useEffect, forwardRef, ReactNode, useContext, useCallback, useRef, useMemo, Ref } from 'react'
 import { StyleSheet, NativeSyntheticEvent, View, LayoutChangeEvent } from 'react-native'
-import { getCustomEvent, injectCatchEvent } from './getInnerListeners'
+import { getCustomEvent } from './getInnerListeners'
 import useNodesRef, { HandlerRef } from './useNodesRef'
 import { MovableAreaContext } from './context'
-import { useTransformStyle, splitProps, splitStyle, DEFAULT_UNLAY_STYLE, wrapChildren, GestureHandler, flatGesture } from './utils'
+import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, GestureHandler, flatGesture } from './utils'
 import { GestureDetector, Gesture, GestureTouchEvent, GestureStateChangeEvent, PanGestureHandlerEventPayload, PanGesture } from 'react-native-gesture-handler'
 import Animated, {
   useSharedValue,
@@ -482,8 +482,27 @@ const _MovableView = forwardRef<HandlerRef<View, MovableViewProps>, MovableViewP
     }
   })
 
+  const injectCatchEvent = (props: Record<string, any>) => {
+    const eventHandlers: Record<string, any> = {}
+    const catchEventList = [
+      { name: 'onTouchStart', value: ['catchtouchstart'] },
+      { name: 'onTouchMove', value: ['catchtouchmove', 'catchvtouchmove', 'catchhtouchmove'] },
+      { name: 'onTouchEnd', value: ['catchtouchend'] }
+    ]
+    catchEventList.forEach(event => {
+      event.value.forEach(name => {
+        if (props[name] && !eventHandlers[event.name]) {
+          eventHandlers[event.name] = (e: NativeSyntheticEvent<TouchEvent>) => {
+            e.stopPropagation()
+          }
+        }
+      })
+    })
+    return eventHandlers
+  }
+
   const catchEventHandlers = injectCatchEvent(props)
-  const layoutStyle = !hasLayoutRef.current && hasSelfPercent ? DEFAULT_UNLAY_STYLE : {}
+  const layoutStyle = !hasLayoutRef.current && hasSelfPercent ? HIDDEN_STYLE : {}
   return (
     <GestureDetector gesture={gesture}>
       <Animated.View

diff --git a/packages/webpack-plugin/lib/runtime/components/react/utils.tsx b/packages/webpack-plugin/lib/runtime/components/react/utils.tsx
@@ -11,7 +11,7 @@ export const URL_REGEX = /^\s*url\(["']?(.*?)["']?\)\s*$/
 export const BACKGROUND_REGEX = /^background(Image|Size|Repeat|Position)$/
 export const TEXT_PROPS_REGEX = /ellipsizeMode|numberOfLines/
 export const DEFAULT_FONT_SIZE = 16
-export const DEFAULT_UNLAY_STYLE = {
+export const HIDDEN_STYLE = {
   opacity: 0
 }
 
@@ -472,7 +472,7 @@ interface LayoutConfig {
 export const useLayout = ({ props, hasSelfPercent, setWidth, setHeight, onLayout, nodeRef }: LayoutConfig) => {
   const layoutRef = useRef({})
   const hasLayoutRef = useRef(false)
-  const layoutStyle: Record<string, any> = !hasLayoutRef.current && hasSelfPercent ? DEFAULT_UNLAY_STYLE : {}
+  const layoutStyle: Record<string, any> = !hasLayoutRef.current && hasSelfPercent ? HIDDEN_STYLE : {}
   const layoutProps: Record<string, any> = {}
   const enableOffset = props['enable-offset']
   if (hasSelfPercent || onLayout || enableOffset) {