@mpxjs/webpack-plugin 2.9.64 → 2.9.66

package/lib/runtime/components/react/dist/mpx-movable-area.jsx

@@ -2,7 +2,7 @@
  * ✘ scale-area
  */
 import { View } from 'react-native';
-import { useState, useEffect, forwardRef } from 'react';
+import { useState, useEffect, forwardRef, useRef } from 'react';
 import useNodesRef from './useNodesRef';
 import useInnerProps from './getInnerListeners';
 import { MovableAreaContext } from './context';
@@ -16,7 +16,8 @@ const _MovableArea = forwardRef((props, ref) => {
         setAreaHeight(height);
     }, [width, height]);
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
-    const { nodeRef: movableViewRef } = useNodesRef(props, ref);
+    const movableViewRef = useRef(null);
+    useNodesRef(props, ref, movableViewRef);
     const onLayout = (e) => {
         const { width = 10, height = 10 } = e.nativeEvent.layout;
         setAreaWidth(width);

package/lib/runtime/components/react/dist/mpx-movable-view.jsx

@@ -41,7 +41,8 @@ const _MovableView = forwardRef((props, ref) => {
         x: Number(x),
         y: Number(y)
     });
-    const { nodeRef } = useNodesRef(props, ref, {
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {
         defaultStyle: styles.container
     });
     let panResponder = {};

package/lib/runtime/components/react/dist/mpx-picker/date.jsx

@@ -27,7 +27,8 @@ const _DatePicker = forwardRef((props, ref) => {
     const [datevalue, setDateValue] = useState(value);
     // 存储layout布局信息
     const layoutRef = useRef({});
-    const { nodeRef: viewRef } = useNodesRef(props, ref, {});
+    const viewRef = useRef(null);
+    useNodesRef(props, ref, viewRef, {});
     useEffect(() => {
         value && setDateValue(value);
     }, [value]);

package/lib/runtime/components/react/dist/mpx-picker/index.jsx

@@ -30,7 +30,8 @@ import { FormContext } from '../context';
 const _Picker = forwardRef((props, ref) => {
     const { mode = 'selector', value, bindcancel, bindchange, children, bindcolumnchange } = props;
     const innerLayout = useRef({});
-    const { nodeRef } = useNodesRef(props, ref, {});
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {});
     const innerProps = useInnerProps(props, {
         ref: nodeRef
     }, [], { layoutRef: innerLayout });

package/lib/runtime/components/react/dist/mpx-picker/multiSelector.jsx

@@ -86,7 +86,8 @@ const _MultiSelectorPicker = forwardRef((props, ref) => {
     const [data, setData] = useState(formatRange || []);
     // 存储layout布局信息
     const layoutRef = useRef({});
-    const { nodeRef: viewRef } = useNodesRef(props, ref, {});
+    const viewRef = useRef(null);
+    useNodesRef(props, ref, viewRef, {});
     useEffect(() => {
         if (range) {
             const newFormatRange = formatRangeFun(range, props['range-key']);

package/lib/runtime/components/react/dist/mpx-picker/region.jsx

@@ -40,7 +40,8 @@ const _RegionPicker = forwardRef((props, ref) => {
     const [regionvalue, setRegionValue] = useState(value);
     // 存储layout布局信息
     const layoutRef = useRef({});
-    const { nodeRef: viewRef } = useNodesRef(props, ref, {});
+    const viewRef = useRef(null);
+    useNodesRef(props, ref, viewRef, {});
     const onChange = (value) => {
         // 通过 value 查找 code
         let tmp = regionData;

package/lib/runtime/components/react/dist/mpx-picker/selector.jsx

@@ -27,7 +27,8 @@ const _SelectorPicker = forwardRef((props, ref) => {
     const [data, setData] = useState(formatRange || []);
     // 存储layout布局信息
     const layoutRef = useRef({});
-    const { nodeRef: viewRef } = useNodesRef(props, ref, {});
+    const viewRef = useRef(null);
+    useNodesRef(props, ref, viewRef, {});
     useEffect(() => {
         if (range) {
             const newFormatRange = formatRangeFun(range, props['range-key']);

package/lib/runtime/components/react/dist/mpx-picker/time.jsx

@@ -126,10 +126,12 @@ const _TimePicker = forwardRef((props, ref) => {
     const [timevalue, setTimeValue] = useState(defaultValue);
     // 存储layout布局信息
     const layoutRef = useRef({});
-    const { nodeRef: viewRef } = useNodesRef(props, ref, {});
+    const viewRef = useRef(null);
+    useNodesRef(props, ref, viewRef, {});
     // 存储modal的布局信息
     const modalLayoutRef = useRef({});
-    const { nodeRef: modalRef } = useNodesRef(props, ref, {});
+    const modalRef = useRef(null);
+    useNodesRef(props, ref, modalRef, {});
     const [visible, setVisible] = useState(false);
     const columnData = generateColumns();
     const [data, setData] = useState(columnData);

package/lib/runtime/components/react/dist/mpx-picker-view-column.jsx

@@ -1,5 +1,5 @@
 import { View, Animated, SafeAreaView } from 'react-native';
-import React, { forwardRef, useState, useEffect } from 'react';
+import React, { forwardRef, useRef, useState, useEffect } from 'react';
 import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout } from './utils';
 import useNodesRef from './useNodesRef'; // 引入辅助函数
 const defaultItemHeight = 36;
@@ -13,7 +13,8 @@ const _PickerViewColumn = forwardRef((props, ref) => {
     const { textProps } = splitProps(props);
     // const { innerStyle } = splitStyle(normalStyle)
     // scrollView的ref
-    const { nodeRef: scrollViewRef } = useNodesRef(props, ref, {});
+    const scrollViewRef = useRef(null);
+    useNodesRef(props, ref, scrollViewRef, {});
     // 每个元素的高度
     let [itemH, setItemH] = useState(0);
     useEffect(() => {

package/lib/runtime/components/react/dist/mpx-picker-view.jsx

@@ -30,7 +30,8 @@ const _PickerView = forwardRef((props, ref) => {
     // 微信设置到pick-view上上设置的normalStyle如border等需要转换成RN的style然后进行透传
     const indicatorStyle = parseInlineStyle(props['indicator-style']);
     const { height: indicatorH, width: indicatorW } = indicatorStyle;
-    const { nodeRef } = useNodesRef(props, ref, {});
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {});
     //  picker-view 设置的color等textStyle,在小程序上的表现是可以继承到最内层的text样式, 但是RN内部column是slot无法设置, 需要业务自己在column内的元素上设置
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext });
     const { textStyle } = splitStyle(normalStyle);

package/lib/runtime/components/react/dist/mpx-radio-group.jsx

@@ -25,7 +25,8 @@ const radioGroup = forwardRef((props, ref) => {
         ...style
     };
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(styleObj, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
-    const { nodeRef } = useNodesRef(props, ref, { defaultStyle });
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, { defaultStyle });
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
     const getSelectionValue = () => {
         for (const key in groupValue) {

package/lib/runtime/components/react/dist/mpx-radio.jsx

@@ -4,7 +4,7 @@
  * ✔ checked
  * ✔ color
  */
-import { useState, forwardRef, useEffect, useContext } from 'react';
+import { useRef, useState, forwardRef, useEffect, useContext } from 'react';
 import { View, StyleSheet } from 'react-native';
 import { warn } from '@mpxjs/utils';
 import { LabelContext, RadioGroupContext } from './context';
@@ -92,7 +92,8 @@ const Radio = forwardRef((radioProps, ref) => {
     if (backgroundStyle) {
         warn('Radio does not support background image-related styles!');
     }
-    const { nodeRef } = useNodesRef(props, ref, {
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {
         defaultStyle,
         change: onChange
     });

package/lib/runtime/components/react/dist/mpx-scroll-view.jsx

@@ -33,14 +33,16 @@
  */
 import { ScrollView } from 'react-native-gesture-handler';
 import { RefreshControl } from 'react-native';
-import { useRef, useState, useEffect, forwardRef } from 'react';
+import { useRef, useState, useEffect, forwardRef, useContext } from 'react';
+import { useAnimatedRef } from 'react-native-reanimated';
 import { warn } from '@mpxjs/utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
 import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren } from './utils';
+import { IntersectionObserverContext } from './context';
 const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const { textProps, innerProps: props = {} } = splitProps(scrollViewProps);
-    const { enhanced = false, bounces = true, style = {}, 'scroll-x': scrollX = false, 'scroll-y': scrollY = false, 'enable-back-to-top': enableBackToTop = false, 'paging-enabled': pagingEnabled = false, 'upper-threshold': upperThreshold = 50, 'lower-threshold': lowerThreshold = 50, 'scroll-with-animation': scrollWithAnimation, 'refresher-enabled': refresherEnabled, 'refresher-default-style': refresherDefaultStyle, 'refresher-background': refresherBackground, 'show-scrollbar': showScrollbar = true, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight } = props;
+    const { enhanced = false, bounces = true, style = {}, 'scroll-x': scrollX = false, 'scroll-y': scrollY = false, 'enable-back-to-top': enableBackToTop = false, 'enable-trigger-intersection-observer': enableTriggerIntersectionObserver = false, 'paging-enabled': pagingEnabled = false, 'upper-threshold': upperThreshold = 50, 'lower-threshold': lowerThreshold = 50, 'scroll-with-animation': scrollWithAnimation, 'refresher-enabled': refresherEnabled, 'refresher-default-style': refresherDefaultStyle, 'refresher-background': refresherBackground, 'show-scrollbar': showScrollbar = true, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight } = props;
     const [refreshing, setRefreshing] = useState(true);
     const snapScrollTop = useRef(0);
     const snapScrollLeft = useRef(0);
@@ -55,9 +57,11 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const hasCallScrollToUpper = useRef(true);
     const hasCallScrollToLower = useRef(false);
     const initialTimeout = useRef(null);
+    const intersectionObservers = useContext(IntersectionObserverContext);
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const { textStyle, innerStyle } = splitStyle(normalStyle);
-    const { nodeRef: scrollViewRef } = useNodesRef(props, ref, {
+    const scrollViewRef = useAnimatedRef();
+    useNodesRef(props, ref, scrollViewRef, {
         scrollOffset: scrollOptions,
         node: {
             scrollEnabled: scrollX || scrollY,
@@ -171,6 +175,11 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
                 layoutRef
             }, props));
         updateScrollOptions(e, { scrollLeft, scrollTop });
+        if (enableTriggerIntersectionObserver && intersectionObservers) {
+            for (const key in intersectionObservers) {
+                intersectionObservers[key].throttleMeasure();
+            }
+        }
     }
     function onScrollEnd(e) {
         const { bindscrollend } = props;
@@ -277,6 +286,7 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         'scroll-x',
         'scroll-y',
         'enable-back-to-top',
+        'enable-trigger-intersection-observer',
         'paging-enabled',
         'show-scrollbar',
         'upper-threshold',

package/lib/runtime/components/react/dist/mpx-swiper/carouse.jsx

@@ -67,31 +67,33 @@ const _Carouse = forwardRef((props, ref) => {
     const initOffsetIndex = initIndex + (props.circular && totalElements > 1 ? 1 : 0);
     const defaultX = (defaultWidth * initOffsetIndex) || 0;
     const defaultY = (defaultHeight * initOffsetIndex) || 0;
+    // 主动scorllTo时是否要出发onScrollEnd
+    const needTriggerScrollEnd = useRef(true);
     // 内部存储上一次的offset值
     const autoplayTimerRef = useRef(null);
-    const { nodeRef: scrollViewRef } = useNodesRef(props, ref, {});
+    const scrollViewRef = useRef(null);
+    useNodesRef(props, ref, scrollViewRef, {});
     const { 
     // 存储layout布局信息
     layoutRef, layoutProps, layoutStyle } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: scrollViewRef, onLayout: onWrapperLayout });
     // 内部存储上一次的偏移量
     const internalsRef = useRef({
         offset: {
-            x: defaultX || 0,
-            y: defaultY || 0
+            x: 0,
+            y: 0
         },
         isScrolling: false
     });
     const isDragRef = useRef(false);
     const [state, setState] = useState({
-        children: newChild,
         width: dir === 'x' && typeof defaultWidth === 'number' ? defaultWidth - previousMargin - nextMargin : defaultWidth,
         height: dir === 'y' && typeof defaultHeight === 'number' ? defaultHeight - previousMargin - nextMargin : defaultHeight,
         // 真正的游标索引, 从0开始
         index: initIndex,
         total: totalElements,
         offset: {
-            x: dir === 'x' ? defaultX : 0,
-            y: dir === 'y' ? defaultY : 0
+            x: 0,
+            y: 0
         },
         dir
     });
@@ -112,25 +114,38 @@ const _Carouse = forwardRef((props, ref) => {
     }, [props.autoplay, props.current, state.index, state.width, state.height]);
     useEffect(() => {
         // 确认这个是变化的props变化的时候才执行，还是初始化的时候就执行
-        if (!props.autoplay && props.current !== state.index) {
+        if (!props.autoplay && props.current !== undefined && props.current !== state.index) {
             const initIndex = props.current || 0;
             // 这里要排除超过元素个数的设置
-            const initOffsetIndex = initIndex + (props.circular && totalElements > 1 ? 1 : 0);
-            const defaultX = (defaultWidth * initOffsetIndex) || 0;
-            const offset = {
-                x: dir === 'x' ? defaultX : 0,
-                y: dir === 'y' ? defaultY : 0
-            };
-            state.offset = offset;
-            internalsRef.current.offset = offset;
-            setState((preState) => {
-                return {
-                    ...preState,
-                    offset
-                };
-            });
+            const { nextIndex, nextOffset } = getMultiNextConfig(props.current);
+            // 1. 安卓需要主动更新下内部状态, 2. IOS不能触发完wcrollTo之后立即updateState, 会造成滑动两次
+            // 2. setTimeout 是fix 当再渲染过程中触发scrollTo失败的问题
+            if (Platform.OS === 'ios') {
+                needTriggerScrollEnd.current = false;
+                setTimeout(() => {
+                    scrollViewRef.current?.scrollTo({
+                        ...nextOffset,
+                        animated: true
+                    });
+                }, 50);
+            }
+            else {
+                updateState(nextIndex, nextOffset);
+            }
         }
-    }, [props.current]);
+    }, [props.current, state.width, state.height]);
+    function getMultiNextConfig(target) {
+        const step = state.dir === 'x' ? state.width : state.height;
+        const targetPos = step * props.current;
+        const targetOffset = {
+            x: dir === 'x' ? targetPos : 0,
+            y: dir === 'y' ? targetPos : 0
+        };
+        return {
+            nextIndex: target,
+            nextOffset: targetOffset
+        };
+    }
     /**
      * @desc: 更新状态: index和offset, 并响应索引变化的事件
      * scrollViewOffset: 移动到的目标位置
@@ -180,7 +195,6 @@ const _Carouse = forwardRef((props, ref) => {
             nextIndex = isBack ? nextIndex - 2 : nextIndex;
         }
         if (!props.circular) {
-            // nextIndex = isBack ? nextIndex - 2 : nextIndex
             nextOffset = Object.assign({}, currentOffset, { [state.dir]: step * nextIndex });
         }
         else {
@@ -229,13 +243,12 @@ const _Carouse = forwardRef((props, ref) => {
             createAutoPlay();
             return;
         }
-        if (!Array.isArray(state.children)) {
+        if (!Array.isArray(props.children)) {
             return;
         }
         const step = state.dir === 'x' ? state.width : state.height;
         const { nextOffset, autoMoveOffset, isAutoEnd } = getNextConfig(state.offset);
         // 这里可以scroll到下一个元素, 但是把scrollView的偏移量在设置为content,视觉效果就没了吧
-        // scrollViewRef.current?.scrollTo({ x: nextOffset['x'], y: nextOffset['y'], animated: true })
         if (Platform.OS === 'ios') {
             if (!isAutoEnd) {
                 scrollViewRef.current?.scrollTo({ x: nextOffset.x, y: nextOffset.y, animated: true });
@@ -265,7 +278,6 @@ const _Carouse = forwardRef((props, ref) => {
                 // 安卓无法实现视觉的无缝连接, 只能回到真正的位置, 且安卓调用scrollTo不能触发onMomentumScrollEnd,还未找到为啥
                 if (state.dir === 'x') {
                     scrollViewRef.current?.scrollTo({ x: step, y: step, animated: true });
-                    // scrollViewRef.current?.scrollTo({ x: autoMoveOffset.x, y: autoMoveOffset.y, animated: true })
                 }
                 else {
                     scrollViewRef.current?.scrollTo({ x: autoMoveOffset.x, y: step, animated: true });
@@ -282,9 +294,15 @@ const _Carouse = forwardRef((props, ref) => {
     }
     /**
      * 当用户开始拖动结束
+     * 注意: 当手动调用scrollTo的时候, 安卓不会触发onMomentumScrollEnd, IOS会触发onMomentumScrollEnd
      */
     function onScrollEnd(event) {
-        // 这里安卓好像没有触发onScrollEnd, 调用scrollTo的时候
+        if (Platform.OS === 'ios' && !needTriggerScrollEnd.current) {
+            const { nextIndex, nextOffset } = getMultiNextConfig(props.current);
+            updateState(nextIndex, nextOffset);
+            needTriggerScrollEnd.current = true;
+            return;
+        }
         if (totalElements === 1) {
             return;
         }
@@ -310,58 +328,41 @@ const _Carouse = forwardRef((props, ref) => {
      * @desc: 水平方向时，获取元素的布局，更新, 其中如果传递100%时需要依赖measure计算元算的宽高
     */
     function onWrapperLayout(e) {
-        if (hasSelfPercent) {
-            const { width, height } = e?.nativeEvent?.layout || {};
-            setWidth(width || 0);
-            setHeight(height || 0);
-        }
-        if (props.enableOffset) {
-            scrollViewRef.current?.measure((x, y, width, height, offsetLeft, offsetTop) => {
-                layoutRef.current = { x, y, width, height, offsetLeft, offsetTop };
-                const isWDiff = state.width !== width;
-                const isHDiff = state.height !== height;
-                if (isWDiff || isHDiff) {
-                    const changeState = {
-                        width: isWDiff ? width : state.width,
-                        height: isHDiff ? height : state.height
+        scrollViewRef.current?.measure((x, y, width, height, offsetLeft, offsetTop) => {
+            layoutRef.current = { x, y, width, height, offsetLeft, offsetTop };
+            const isWDiff = state.width !== width;
+            const isHDiff = state.height !== height;
+            if (isWDiff || isHDiff) {
+                const changeState = {
+                    width: isWDiff ? width : state.width,
+                    height: isHDiff ? height : state.height
+                };
+                const attr = state.dir === 'x' ? 'width' : 'height';
+                changeState[attr] = changeState[attr] - previousMargin - nextMargin;
+                const correctOffset = Object.assign({}, state.offset, {
+                    [state.dir]: initOffsetIndex * (state.dir === 'x' ? changeState.width : changeState.height)
+                });
+                state.width = changeState.width;
+                state.height = changeState.height;
+                // 这里setState之后,会再触发重新渲染, renderScrollView会再次触发onScrollEnd,
+                setState((preState) => {
+                    return {
+                        ...preState,
+                        width: changeState.width,
+                        height: changeState.height
                     };
-                    const attr = state.dir === 'x' ? 'width' : 'height';
-                    changeState[attr] = changeState[attr] - previousMargin - nextMargin;
-                    const correctOffset = Object.assign({}, state.offset, {
-                        [state.dir]: initOffsetIndex * (state.dir === 'x' ? changeState.width : changeState.height)
-                    });
-                    state.offset = correctOffset;
-                    state.width = changeState.width;
-                    state.height = changeState.height;
-                    setState((preState) => {
-                        return {
-                            ...preState,
-                            offset: correctOffset,
-                            width: changeState.width,
-                            height: changeState.height
-                        };
-                    });
-                    scrollViewRef.current?.scrollTo({ x: correctOffset.x, y: correctOffset.y, animated: false });
-                }
-                props.getInnerLayout && props.getInnerLayout(layoutRef);
-            });
-        }
+                });
+            }
+            props.getInnerLayout && props.getInnerLayout(layoutRef);
+        });
     }
     function getOffset() {
         const step = state.dir === 'x' ? state.width : state.height;
         if (!step || Number.isNaN(+step))
             return [];
         const offsetArray = [];
-        if (previousMargin) {
-            offsetArray.push(0);
-            for (let i = 1; i < totalElements; i++) {
-                offsetArray.push(i * step - previousMargin);
-            }
-        }
-        else {
-            for (let i = 0; i < totalElements; i++) {
-                offsetArray.push(i * step);
-            }
+        for (let i = 0; i < totalElements; i++) {
+            offsetArray.push(i * step);
         }
         return offsetArray;
     }
@@ -370,7 +371,7 @@ const _Carouse = forwardRef((props, ref) => {
         const scrollElementProps = {
             ref: scrollViewRef,
             horizontal: props.horizontal,
-            pagingEnabled: false,
+            pagingEnabled: true,
             snapToOffsets: offsetsArray,
             decelerationRate: 0.99,
             showsHorizontalScrollIndicator: false,
@@ -422,20 +423,21 @@ const _Carouse = forwardRef((props, ref) => {
       </View>);
     }
     function renderPages() {
-        const { width, height, total, children } = state;
+        const { width, height } = state;
+        const { children } = props;
         const { circular } = props;
         const pageStyle = { width: width, height: height };
         // 设置了previousMargin或者nextMargin,
         // 1. 元素的宽度是减去这两个数目之和
         // 2. previousMargin设置marginLeft正值, nextmargin设置marginRight负值
         // 3. 第一个元素设置previousMargin 和 nextMargin, 最后一个元素
-        if (total > 1 && Array.isArray(children)) {
+        if (totalElements > 1 && Array.isArray(children)) {
             let arrElements = [];
             // pages = ["2", "0", "1", "2", "0"]
             const pages = Array.isArray(children) ? Object.keys(children) : [];
             /* 无限循环的时候 */
             if (circular) {
-                pages.unshift(total - 1 + '');
+                pages.unshift(totalElements - 1 + '');
                 pages.push('0');
             }
             arrElements = pages.map((page, i) => {
@@ -446,7 +448,6 @@ const _Carouse = forwardRef((props, ref) => {
                 else if (i === pages.length - 1 && typeof width === 'number') {
                     nextMargin && (extraStyle.marginRight = nextMargin);
                 }
-                // return (<View style={[pageStyle, styles.slide, extraStyle]} key={ 'page' + i}>{children[+page]}</View>)
                 return (<View style={[pageStyle, styles.slide, extraStyle]} key={'page' + i}>
           {wrapChildren({
                         children: children[+page]

package/lib/runtime/components/react/dist/mpx-swiper/index.jsx

@@ -43,7 +43,8 @@ const _SwiperWrapper = forwardRef((props, ref) => {
         bindchange: props.bindchange,
         easingFunction: props['easing-function'] || 'default'
     };
-    const { nodeRef } = useNodesRef(props, ref, {});
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {});
     const innerProps = useInnerProps(props, {
         ref: nodeRef
     }, [

package/lib/runtime/components/react/dist/mpx-swiper-item.jsx

@@ -1,12 +1,13 @@
 import { View } from 'react-native';
-import { forwardRef } from 'react';
+import { forwardRef, useRef } from 'react';
 import useInnerProps from './getInnerListeners';
 import useNodesRef from './useNodesRef'; // 引入辅助函数
 import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout } from './utils';
 const _SwiperItem = forwardRef((props, ref) => {
     const { 'enable-offset': enableOffset, 'enable-var': enableVar, 'external-var-context': externalVarContext, style } = props;
     const { textProps } = splitProps(props);
-    const { nodeRef } = useNodesRef(props, ref, {});
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef, {});
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext });
     const { textStyle, innerStyle } = splitStyle(normalStyle);
     const { 

package/lib/runtime/components/react/dist/mpx-switch.jsx

@@ -5,7 +5,7 @@
  * ✔ color
  */
 import { Switch } from 'react-native';
-import { useEffect, forwardRef, useState, useContext } from 'react';
+import { useRef, useEffect, forwardRef, useState, useContext } from 'react';
 import { warn } from '@mpxjs/utils';
 import useNodesRef from './useNodesRef'; // 引入辅助函数
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
@@ -31,7 +31,8 @@ const _Switch = forwardRef((props, ref) => {
     useEffect(() => {
         setIsChecked(checked);
     }, [checked]);
-    const { nodeRef } = useNodesRef(props, ref);
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef);
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
     const onChange = (evt, { checked } = {}) => {
         if (type === 'switch') {

package/lib/runtime/components/react/dist/mpx-text.jsx

@@ -18,7 +18,8 @@ const _Text = forwardRef((props, ref) => {
         parentWidth,
         parentHeight
     });
-    const { nodeRef } = useNodesRef(props, ref);
+    const nodeRef = useRef(null);
+    useNodesRef(props, ref, nodeRef);
     const innerProps = useInnerProps(props, {
         ref: nodeRef,
         style: normalStyle,