From d685466262df30b686b6d42fb8203c344868130a Mon Sep 17 00:00:00 2001
From: Soon Wang <wangshunnn@gmail.com>
Date: Thu, 16 Oct 2025 15:27:19 +0800
Subject: [PATCH] perf: use `contentOffset` instead of `onContentSizeChange` in
 PikcerView Component

---
 .../react/mpx-picker-view-column/index.tsx    | 20 +++++++------------
 .../react/mpx-picker-view/index.tsx           |  2 +-
 2 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column/index.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column/index.tsx
index 444b60717a..32512ce4c8 100644
--- a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column/index.tsx
+++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column/index.tsx
@@ -98,6 +98,11 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
     return [{ paddingVertical: paddingHeight }]
   }, [paddingHeight])
 
+  const initialContentOffsetY = useMemo(
+    () => initialIndex * itemRawH,
+    [initialIndex, itemRawH]
+  )
+
   const getIndex = useCallback((y: number) => {
     const calc = Math.round(y / itemRawH)
     return Math.max(0, Math.min(calc, maxIndex))
@@ -155,17 +160,6 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
     }, isIOS ? 0 : 200)
   }, [itemRawH, maxIndex, initialIndex])
 
-  const onContentSizeChange = useCallback((_w: number, h: number) => {
-    const y = initialIndex * itemRawH
-    if (y <= h) {
-      clearTimerScrollTo()
-      timerScrollTo.current = setTimeout(() => {
-        scrollViewRef.current?.scrollTo({ x: 0, y, animated: false })
-        activeIndex.current = initialIndex
-      }, 0)
-    }
-  }, [itemRawH, initialIndex])
-
   const onItemLayout = useCallback((e: LayoutChangeEvent) => {
     const { height: rawH } = e.nativeEvent.layout
     const roundedH = Math.round(rawH)
@@ -331,8 +325,8 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
       onScrollEndDrag,
       onMomentumScrollBegin,
       onMomentumScrollEnd,
-      onContentSizeChange,
-      contentContainerStyle
+      contentContainerStyle,
+      contentOffset: { x: 0, y: initialContentOffsetY }
     }) as React.ComponentProps<typeof Reanimated.ScrollView>
 
     return createElement(
diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view/index.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view/index.tsx
index e8ca835013..03b6aa79bf 100644
--- a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view/index.tsx
+++ b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view/index.tsx
@@ -170,7 +170,7 @@ const _PickerView = forwardRef<HandlerRef<View, PickerViewProps>, PickerViewProp
         columnData,
         ref: cloneRef,
         columnIndex: index,
-        key: `pick-view-${index}`,
+        key: `pick-view-${index}-${columnData.length}`,
         wrapperStyle: {
           height: normalStyle?.height || DefaultPickerItemH,
           itemHeight: indicatorH || DefaultPickerItemH