@mpxjs/webpack-plugin 2.10.15-5 → 2.10.15

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

@@ -4,8 +4,8 @@
  * ✔ out-of-bounds
  * ✔ x
  * ✔ y
- * ✘ damping
- * ✘ friction
+ * ✔ damping
+ * ✔ friction
  * ✔ disabled
  * ✘ scale
  * ✘ scale-min
@@ -24,8 +24,96 @@ import useNodesRef from './useNodesRef';
 import { MovableAreaContext } from './context';
 import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback } from './utils';
 import { GestureDetector, Gesture } from 'react-native-gesture-handler';
-import Animated, { useSharedValue, useAnimatedStyle, withDecay, runOnJS, runOnUI, withSpring } from 'react-native-reanimated';
+import Animated, { useSharedValue, useAnimatedStyle, runOnJS, runOnUI, withTiming, Easing } from 'react-native-reanimated';
 import { collectDataset, noop } from '@mpxjs/utils';
+// 超出边界处理函数，参考微信小程序的超出边界衰减效果
+const applyBoundaryDecline = (newValue, range) => {
+    'worklet';
+    const decline = (distance) => {
+        'worklet';
+        return Math.sqrt(Math.abs(distance));
+    };
+    if (newValue < range[0]) {
+        const overDistance = range[0] - newValue;
+        return range[0] - decline(overDistance);
+    }
+    else if (newValue > range[1]) {
+        const overDistance = newValue - range[1];
+        return range[1] + decline(overDistance);
+    }
+    return newValue;
+};
+// 参考微信小程序的弹簧阻尼系统实现
+const withWechatSpring = (toValue, dampingParam = 20, callback) => {
+    'worklet';
+    // 弹簧参数计算
+    const m = 1; // 质量
+    const k = 9 * Math.pow(dampingParam, 2) / 40; // 弹簧系数
+    const c = dampingParam; // 阻尼系数
+    // 判别式：r = c² - 4mk
+    const discriminant = c * c - 4 * m * k;
+    // 计算动画持续时间和缓动函数
+    let duration;
+    let easingFunction;
+    if (Math.abs(discriminant) < 0.01) {
+        // 临界阻尼 (discriminant ≈ 0)
+        // 使用cubic-out模拟临界阻尼的平滑过渡
+        duration = Math.max(350, Math.min(800, 2000 / dampingParam));
+        easingFunction = Easing.out(Easing.cubic);
+    }
+    else if (discriminant > 0) {
+        // 过阻尼 (discriminant > 0)
+        // 使用指数缓动模拟过阻尼的缓慢收敛
+        duration = Math.max(450, Math.min(1000, 2500 / dampingParam));
+        easingFunction = Easing.out(Easing.exp);
+    }
+    else {
+        // 欠阻尼 (discriminant < 0) - 会产生振荡
+        // 计算振荡频率和衰减率
+        const dampingRatio = c / (2 * Math.sqrt(m * k)); // 阻尼比
+        // 根据阻尼比调整动画参数
+        if (dampingRatio < 0.7) {
+            // 明显振荡
+            duration = Math.max(600, Math.min(1200, 3000 / dampingParam));
+            // 创建带振荡的贝塞尔曲线
+            easingFunction = Easing.bezier(0.175, 0.885, 0.32, 1.275);
+        }
+        else {
+            // 轻微振荡
+            duration = Math.max(400, Math.min(800, 2000 / dampingParam));
+            easingFunction = Easing.bezier(0.25, 0.46, 0.45, 0.94);
+        }
+    }
+    return withTiming(toValue, {
+        duration,
+        easing: easingFunction
+    }, callback);
+};
+// 参考微信小程序friction的惯性动画
+const withWechatDecay = (velocity, currentPosition, clampRange, frictionValue = 2, callback) => {
+    'worklet';
+    // 微信小程序friction算法: delta = -1.5 * v² / a, 其中 a = -f * v / |v|
+    // 如果friction小于等于0，设置为默认值2
+    const validFriction = frictionValue <= 0 ? 2 : frictionValue;
+    const f = 1000 * validFriction;
+    const acceleration = velocity !== 0 ? -f * velocity / Math.abs(velocity) : 0;
+    const delta = acceleration !== 0 ? (-1.5 * velocity * velocity) / acceleration : 0;
+    let finalPosition = currentPosition + delta;
+    // 边界限制
+    if (finalPosition < clampRange[0]) {
+        finalPosition = clampRange[0];
+    }
+    else if (finalPosition > clampRange[1]) {
+        finalPosition = clampRange[1];
+    }
+    // 计算动画时长
+    const distance = Math.abs(finalPosition - currentPosition);
+    const duration = Math.min(1500, Math.max(200, distance * 8));
+    return withTiming(finalPosition, {
+        duration,
+        easing: Easing.out(Easing.cubic)
+    }, callback);
+};
 const styles = StyleSheet.create({
     container: {
         position: 'absolute',
@@ -41,7 +129,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const hasLayoutRef = useRef(false);
     const propsRef = useRef({});
     propsRef.current = (props || {});
-    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'disable-event-passthrough': disableEventPassthrough = false, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindchange } = props;
+    const { x = 0, y = 0, inertia = false, disabled = false, animation = true, damping = 20, friction = 2, 'out-of-bounds': outOfBounds = false, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, direction = 'none', 'disable-event-passthrough': disableEventPassthrough = false, 'simultaneous-handlers': originSimultaneousHandlers = [], 'wait-for': waitFor = [], style = {}, changeThrottleTime = 60, bindtouchstart, catchtouchstart, bindhtouchmove, bindvtouchmove, bindtouchmove, catchhtouchmove, catchvtouchmove, catchtouchmove, bindtouchend, catchtouchend, bindchange } = props;
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(Object.assign({}, style, styles.container), { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const navigation = useNavigation();
     const prevSimultaneousHandlersRef = useRef(originSimultaneousHandlers || []);
@@ -106,18 +194,12 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 const { x: newX, y: newY } = checkBoundaryPosition({ positionX: Number(x), positionY: Number(y) });
                 if (direction === 'horizontal' || direction === 'all') {
                     offsetX.value = animation
-                        ? withSpring(newX, {
-                            duration: 1500,
-                            dampingRatio: 0.8
-                        })
+                        ? withWechatSpring(newX, damping)
                         : newX;
                 }
                 if (direction === 'vertical' || direction === 'all') {
                     offsetY.value = animation
-                        ? withSpring(newY, {
-                            duration: 1500,
-                            dampingRatio: 0.8
-                        })
+                        ? withWechatSpring(newY, damping)
                         : newY;
                 }
                 if (bindchange) {
@@ -293,7 +375,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         triggerEndOnJS
     });
     const runOnJSCallback = useRunOnJSCallback(runOnJSCallbackRef);
-    // 节流版本的 change 事件触发
+    // 节流版本的change事件触发
     const handleTriggerChangeThrottled = useCallback(({ x, y, type }) => {
         'worklet';
         const now = Date.now();
@@ -357,7 +439,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                     offsetX.value = x;
                 }
                 else {
-                    offsetX.value = newX;
+                    offsetX.value = applyBoundaryDecline(newX, draggableXRange.value);
                 }
             }
             if (direction === 'vertical' || direction === 'all') {
@@ -367,7 +449,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                     offsetY.value = y;
                 }
                 else {
-                    offsetY.value = newY;
+                    offsetY.value = applyBoundaryDecline(newY, draggableYRange.value);
                 }
             }
             if (bindchange) {
@@ -397,18 +479,12 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 if (x !== offsetX.value || y !== offsetY.value) {
                     if (x !== offsetX.value) {
                         offsetX.value = animation
-                            ? withSpring(x, {
-                                duration: 1500,
-                                dampingRatio: 0.8
-                            })
+                            ? withWechatSpring(x, damping)
                             : x;
                     }
                     if (y !== offsetY.value) {
                         offsetY.value = animation
-                            ? withSpring(y, {
-                                duration: 1500,
-                                dampingRatio: 0.8
-                            })
+                            ? withWechatSpring(y, damping)
                             : y;
                     }
                     if (bindchange) {
@@ -420,14 +496,10 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 }
             }
             else if (inertia) {
-                // 惯性处理
+                // 惯性处理 - 使用微信小程序friction算法
                 if (direction === 'horizontal' || direction === 'all') {
                     xInertialMotion.value = true;
-                    offsetX.value = withDecay({
-                        velocity: e.velocityX / 10,
-                        rubberBandEffect: outOfBounds,
-                        clamp: draggableXRange.value
-                    }, () => {
+                    offsetX.value = withWechatDecay(e.velocityX / 10, offsetX.value, draggableXRange.value, friction, () => {
                         xInertialMotion.value = false;
                         if (bindchange) {
                             runOnJS(runOnJSCallback)('handleTriggerChange', {
@@ -439,11 +511,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
                 }
                 if (direction === 'vertical' || direction === 'all') {
                     yInertialMotion.value = true;
-                    offsetY.value = withDecay({
-                        velocity: e.velocityY / 10,
-                        rubberBandEffect: outOfBounds,
-                        clamp: draggableYRange.value
-                    }, () => {
+                    offsetY.value = withWechatDecay(e.velocityY / 10, offsetY.value, draggableYRange.value, friction, () => {
                         yInertialMotion.value = false;
                         if (bindchange) {
                             runOnJS(runOnJSCallback)('handleTriggerChange', {

package/lib/runtime/components/react/dist/mpx-portal/portal-manager.jsx

@@ -1,5 +1,4 @@
-import { useState, useCallback, forwardRef, useImperativeHandle } from 'react';
-import { View, StyleSheet } from 'react-native';
+import { useState, useCallback, forwardRef, useImperativeHandle, Fragment } from 'react';
 const _PortalManager = forwardRef((props, ref) => {
     const [state, setState] = useState({
         portals: []
@@ -31,10 +30,9 @@ const _PortalManager = forwardRef((props, ref) => {
         portals: state.portals
     }));
     return (<>
-      {state.portals.map(({ key, children }, i) => (<View key={key} collapsable={false} // Need collapsable=false here to clip the elevations
-         style={[StyleSheet.absoluteFill, { zIndex: 1000 + i, pointerEvents: 'box-none' }]}>
+      {state.portals.map(({ key, children }) => (<Fragment key={key}>
           {children}
-        </View>))}
+        </Fragment>))}
     </>);
 });
 export default _PortalManager;

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

@@ -0,0 +1,159 @@
+/**
+ * ✔ percent 进度百分比 0-100
+ * ✘ show-info 在进度条右侧显示百分比
+ * ✘ border-radius 圆角大小
+ * ✘ font-size 右侧百分比字体大小
+ * ✔ stroke-width 进度条线的宽度
+ * ✔ color 进度条颜色（请使用activeColor）
+ * ✔ activeColor 已选择的进度条的颜色
+ * ✔ backgroundColor 未选择的进度条的颜色
+ * ✔ active 进度条从左往右的动画
+ * ✔ active-mode backwards: 动画从头播；forwards：动画从上次结束点接着播
+ * ✔ duration 进度增加1%所需毫秒数
+ * ✔ bindactiveend 动画完成事件
+ */
+import { useRef, forwardRef, useEffect, useState, createElement } from 'react';
+import { View } from 'react-native';
+import Animated, { useSharedValue, useAnimatedStyle, withTiming, Easing, runOnJS } from 'react-native-reanimated';
+import useInnerProps from './getInnerListeners';
+import useNodesRef from './useNodesRef';
+import { useLayout, useTransformStyle, extendObject } from './utils';
+import Portal from './mpx-portal';
+const Progress = forwardRef((props, ref) => {
+    const { percent = 0, 'stroke-width': strokeWidth = 6, color, activeColor = color || '#09BB07', backgroundColor = '#EBEBEB', active = false, 'active-mode': activeMode = 'backwards', duration = 30, bindactiveend, style = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight } = props;
+    const nodeRef = useRef(null);
+    const propsRef = useRef({});
+    propsRef.current = props;
+    // 进度值状态
+    const [lastPercent, setLastPercent] = useState(0);
+    const progressWidth = useSharedValue(0);
+    const { normalStyle, hasSelfPercent, setWidth, setHeight, hasPositionFixed } = useTransformStyle(style, {
+        enableVar,
+        externalVarContext,
+        parentFontSize,
+        parentWidth,
+        parentHeight
+    });
+    const { layoutRef, layoutStyle, layoutProps } = useLayout({
+        props,
+        hasSelfPercent,
+        setWidth,
+        setHeight,
+        nodeRef
+    });
+    useNodesRef(props, ref, nodeRef, {
+        style: normalStyle
+    });
+    // 进度条动画函数
+    const startProgressAnimation = (targetPercent, startPercent, animationDuration, onFinished) => {
+        // 根据 active-mode 设置起始位置
+        progressWidth.value = startPercent;
+        progressWidth.value = withTiming(targetPercent, {
+            duration: animationDuration,
+            easing: Easing.linear
+        }, (finished) => {
+            if (finished && onFinished) {
+                // 在动画回调中，需要使用runOnJS回到主线程
+                runOnJS(onFinished)();
+            }
+        });
+    };
+    // 创建在主线程执行的事件回调函数
+    const triggerActiveEnd = (percent) => {
+        if (bindactiveend) {
+            bindactiveend({
+                type: 'activeend',
+                detail: {
+                    percent: percent
+                }
+            });
+        }
+    };
+    // 进度变化时的动画效果
+    useEffect(() => {
+        const targetPercent = Math.max(0, Math.min(100, percent));
+        if (active) {
+            // 根据 active-mode 确定起始位置
+            let startPercent;
+            if (activeMode === 'backwards') {
+                startPercent = 0;
+            }
+            else {
+                // forwards 模式：使用上次记录的百分比作为起始位置
+                startPercent = lastPercent;
+            }
+            // 计算动画持续时间
+            const percentDiff = Math.abs(targetPercent - startPercent);
+            const animationDuration = percentDiff * duration;
+            // 创建动画完成回调
+            const onAnimationFinished = () => {
+                triggerActiveEnd(targetPercent);
+            };
+            // 执行动画
+            startProgressAnimation(targetPercent, startPercent, animationDuration, onAnimationFinished);
+        }
+        else {
+            progressWidth.value = targetPercent;
+        }
+        setLastPercent(targetPercent);
+    }, [percent, active, activeMode, duration, bindactiveend]);
+    // 初始化时设置进度值
+    useEffect(() => {
+        if (!active) {
+            progressWidth.value = Math.max(0, Math.min(100, percent));
+        }
+    }, []);
+    // 进度条动画样式
+    const animatedProgressStyle = useAnimatedStyle(() => {
+        return {
+            width: `${progressWidth.value}%`
+        };
+    });
+    // 确保数值类型正确
+    const strokeWidthNum = typeof strokeWidth === 'number' ? strokeWidth : parseInt(strokeWidth, 10) || 6;
+    // 容器样式
+    const containerStyle = extendObject({}, {
+        flexDirection: 'row',
+        alignItems: 'center',
+        width: '100%',
+        minHeight: Math.max(strokeWidthNum, 20)
+    }, normalStyle, layoutStyle);
+    // 进度条背景样式
+    const progressBgStyle = {
+        width: '100%',
+        height: strokeWidthNum,
+        backgroundColor,
+        overflow: 'hidden'
+    };
+    // 进度条填充样式
+    const progressFillStyle = {
+        height: '100%',
+        backgroundColor: activeColor
+    };
+    const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
+        ref: nodeRef
+    }), [
+        'percent',
+        'stroke-width',
+        'color',
+        'activeColor',
+        'backgroundColor',
+        'active',
+        'active-mode',
+        'duration',
+        'bindactiveend'
+    ], { layoutRef });
+    const progressComponent = createElement(View, extendObject({}, innerProps, { style: containerStyle }), 
+    // 进度条背景
+    createElement(View, { style: progressBgStyle }, 
+    // 进度条填充
+    createElement(Animated.View, {
+        style: [progressFillStyle, animatedProgressStyle]
+    })));
+    if (hasPositionFixed) {
+        return createElement(Portal, null, progressComponent);
+    }
+    return progressComponent;
+});
+Progress.displayName = 'MpxProgress';
+export default Progress;

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

@@ -74,6 +74,7 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         black: ['#000'],
         white: ['#fff']
     };
+    const isContentSizeChange = useRef(false);
     const { refresherContent, otherContent } = getRefresherContent(props.children);
     const hasRefresher = refresherContent && refresherEnabled;
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, hasPositionFixed, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
@@ -223,7 +224,22 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         }
     }
     function onContentSizeChange(width, height) {
-        scrollOptions.current.contentLength = selectLength({ height, width });
+        isContentSizeChange.current = true;
+        const newContentLength = selectLength({ height, width });
+        const oldContentLength = scrollOptions.current.contentLength;
+        scrollOptions.current.contentLength = newContentLength;
+        // 内容高度变化时，Animated.event 的映射可能会有不生效的场景，所以需要手动设置一下 scrollOffset 的值
+        if (enableSticky && (__mpx_mode__ === 'android' || __mpx_mode__ === 'ios')) {
+            // 当内容变少时，检查当前滚动位置是否超出新的内容范围
+            if (newContentLength < oldContentLength) {
+                const { visibleLength, offset } = scrollOptions.current;
+                const maxOffset = Math.max(0, newContentLength - visibleLength);
+                // 如果当前滚动位置超出了新的内容范围，调整滚动offset
+                if (offset > maxOffset && scrollY) {
+                    scrollOffset.setValue(maxOffset);
+                }
+            }
+        }
     }
     function onLayout(e) {
         const layout = e.nativeEvent.layout || {};
@@ -243,8 +259,9 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     }
     function onScroll(e) {
         const { bindscroll } = props;
-        const { x: scrollLeft, y: scrollTop } = e.nativeEvent.contentOffset;
-        const { width: scrollWidth, height: scrollHeight } = e.nativeEvent.contentSize;
+        const { contentOffset, layoutMeasurement, contentSize } = e.nativeEvent;
+        const { x: scrollLeft, y: scrollTop } = contentOffset;
+        const { width: scrollWidth, height: scrollHeight } = contentSize;
         isAtTop.value = scrollTop <= 0;
         bindscroll &&
             bindscroll(getCustomEvent('scroll', e, {
@@ -254,7 +271,8 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
                     scrollHeight,
                     scrollWidth,
                     deltaX: scrollLeft - scrollOptions.current.scrollLeft,
-                    deltaY: scrollTop - scrollOptions.current.scrollTop
+                    deltaY: scrollTop - scrollOptions.current.scrollTop,
+                    layoutMeasurement
                 },
                 layoutRef
             }, props));
@@ -267,8 +285,9 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     }
     function onScrollEnd(e) {
         const { bindscrollend } = props;
-        const { x: scrollLeft, y: scrollTop } = e.nativeEvent.contentOffset;
-        const { width: scrollWidth, height: scrollHeight } = e.nativeEvent.contentSize;
+        const { contentOffset, layoutMeasurement, contentSize } = e.nativeEvent;
+        const { x: scrollLeft, y: scrollTop } = contentOffset;
+        const { width: scrollWidth, height: scrollHeight } = contentSize;
         isAtTop.value = scrollTop <= 0;
         bindscrollend &&
             bindscrollend(getCustomEvent('scrollend', e, {
@@ -276,7 +295,8 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
                     scrollLeft,
                     scrollTop,
                     scrollHeight,
-                    scrollWidth
+                    scrollWidth,
+                    layoutMeasurement
                 },
                 layoutRef
             }, props));
@@ -323,6 +343,16 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const scrollHandler = RNAnimated.event([{ nativeEvent: { contentOffset: { y: scrollOffset } } }], {
         useNativeDriver: true,
         listener: (event) => {
+            const y = event.nativeEvent.contentOffset.y || 0;
+            // 内容高度变化时，鸿蒙中 listener 回调通过scrollOffset.__getValue获取值一直等于event.nativeEvent.contentOffset.y，值是正确的，但是无法触发 sticky 动画执行，所以需要手动再 set 一次
+            if (__mpx_mode__ === 'harmony') {
+                if (isContentSizeChange.current) {
+                    scrollOffset.setValue(y);
+                    setTimeout(() => {
+                        isContentSizeChange.current = false;
+                    }, 100);
+                }
+            }
             onScroll(event);
         }
     });
@@ -510,6 +540,7 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         showsVerticalScrollIndicator: scrollY && showScrollbar,
         scrollEnabled: !enableScroll ? false : !!(scrollX || scrollY),
         bounces: false,
+        overScrollMode: 'never',
         ref: scrollViewRef,
         onScroll: enableSticky ? scrollHandler : onScroll,
         onContentSizeChange: onContentSizeChange,

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

@@ -120,8 +120,6 @@ const SwiperWrapper = forwardRef((props, ref) => {
     const strVelocity = 'velocity' + dir.toUpperCase();
     // 标识手指触摸和抬起, 起点在onBegin
     const touchfinish = useSharedValue(true);
-    // 记录onUpdate时的方向，用于进行onFinalize中的值修正
-    const preUpdateTransDir = useSharedValue(0);
     // 记录上一帧的绝对定位坐标
     const preAbsolutePos = useSharedValue(0);
     // 记录从onBegin 到 onTouchesUp 时移动的距离
@@ -327,9 +325,11 @@ const SwiperWrapper = forwardRef((props, ref) => {
             resumeLoop
         };
     }, []);
-    function handleSwiperChange(current) {
-        const eventData = getCustomEvent('change', {}, { detail: { current, source: 'touch' }, layoutRef: layoutRef });
-        bindchange && bindchange(eventData);
+    function handleSwiperChange(current, pCurrent) {
+        if (pCurrent !== currentIndex.value) {
+            const eventData = getCustomEvent('change', {}, { detail: { current, source: 'touch' }, layoutRef: layoutRef });
+            bindchange && bindchange(eventData);
+        }
     }
     const runOnJSCallbackRef = useRef({
         loop,
@@ -379,7 +379,7 @@ const SwiperWrapper = forwardRef((props, ref) => {
     // 1. 用户在当前页切换选中项，动画；用户携带选中index打开到swiper页直接选中不走动画
     useAnimatedReaction(() => currentIndex.value, (newIndex, preIndex) => {
         // 这里必须传递函数名, 直接写()=> {}形式会报 访问了未sharedValue信息
-        if (newIndex !== preIndex && preIndex !== null && preIndex !== undefined && bindchange) {
+        if (newIndex !== preIndex && bindchange) {
             runOnJS(runOnJSCallback)('handleSwiperChange', newIndex, propCurrent);
         }
     });
@@ -411,9 +411,9 @@ const SwiperWrapper = forwardRef((props, ref) => {
         }
     }, [children.length]);
     useEffect(() => {
-        // 1. 如果用户在touch的过程中, 外部更新了current以内部为准（小程序表现）
+        // 1. 如果用户在touch的过程中, 外部更新了current以外部为准（小程序表现）
         // 2. 手指滑动过程中更新索引，外部会把current再传入进来，导致offset直接更新，增加判断不同才更新
-        if (propCurrent !== currentIndex.value && touchfinish.value) {
+        if (propCurrent !== currentIndex.value) {
             updateCurrent(propCurrent, step.value);
         }
     }, [propCurrent]);
@@ -662,7 +662,6 @@ const SwiperWrapper = forwardRef((props, ref) => {
                 translation: moveDistance,
                 transdir: moveDistance
             };
-            preUpdateTransDir.value = moveDistance;
             // 1. 支持滑动中超出一半更新索引的能力：只更新索引并不会影响onFinalize依据当前offset计算的索引
             const { half } = computeHalf(eventData);
             if (childrenLength.value > 1 && half) {
@@ -703,17 +702,11 @@ const SwiperWrapper = forwardRef((props, ref) => {
             if (touchfinish.value)
                 return;
             touchfinish.value = true;
-            /**
-             * 安卓修正
-             * 问题：部分安卓机型onFinalize中拿到的absoluteX 有问题
-             * 案例：比如手指从右向左滑的时候，onUpdate拿到的是241.64346313476562， 而onFinalize中拿到的是241.81817626953125，理论上onFinalize中应该比onUpdate小才对吧
-             * 解决方式：修正
-            */
             // 触发过onUpdate正常情况下e[strAbso] - preAbsolutePos.value=0; 未触发过onUpdate的情况下e[strAbso] - preAbsolutePos.value 不为0
             const moveDistance = e[strAbso] - preAbsolutePos.value;
             const eventData = {
                 translation: moveDistance,
-                transdir: Math.abs(moveDistance) > 1 ? moveDistance : preUpdateTransDir.value
+                transdir: moveDistance !== 0 ? moveDistance : e[strAbso] - moveTranstion.value
             };
             // 1. 只有一个元素：循环 和 非循环状态，都走回弹效果
             if (childrenLength.value === 1) {

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

@@ -80,9 +80,25 @@ const _WebView = forwardRef((props, ref) => {
     useNodesRef(props, ref, webViewRef, {
         style: defaultWebViewStyle
     });
+    const hostValidate = (url) => {
+        const host = url && new URL(url).host;
+        const hostWhitelists = mpx.config.rnConfig?.webviewConfig?.hostWhitelists || [];
+        if (hostWhitelists.length) {
+            return hostWhitelists.some((item) => {
+                return host.endsWith(item);
+            });
+        }
+        else {
+            return true;
+        }
+    };
     if (!src) {
         return null;
     }
+    if (!hostValidate(src)) {
+        console.error('访问页面域名不符合domainWhiteLists白名单配置，请确认是否正确配置该域名白名单');
+        return null;
+    }
     const _reload = function () {
         if (__mpx_mode__ !== 'ios') {
             fristLoaded.current = false; // 安卓需要重新设置
@@ -133,6 +149,9 @@ const _WebView = forwardRef((props, ref) => {
         }
     };
     const _message = function (res) {
+        if (!hostValidate(res.nativeEvent?.url)) {
+            return;
+        }
         let data = {};
         let asyncCallback;
         const navObj = promisify({ redirectTo, navigateTo, navigateBack, reLaunch, switchTab });
@@ -184,7 +203,7 @@ const _WebView = forwardRef((props, ref) => {
                 break;
             default:
                 if (type) {
-                    const implement = mpx.config.webviewConfig.apiImplementations && mpx.config.webviewConfig.apiImplementations[type];
+                    const implement = mpx.config.rnConfig.webviewConfig && mpx.config.rnConfig.webviewConfig.apiImplementations && mpx.config.rnConfig.webviewConfig.apiImplementations[type];
                     if (isFunction(implement)) {
                         asyncCallback = Promise.resolve(implement(...params));
                     }