@arco-design/mobile-react 2.30.8 → 2.30.10

package/esm/_helpers/render.d.ts

@@ -1,12 +1,17 @@
 import { FunctionComponent } from 'react';
 import { RootType } from './react-dom';
 import { GlobalContextParams } from '../context-provider';
+export declare const renderRootCache: Record<string, RootType | undefined>;
 export declare class ReactDOMRender {
     root: RootType | undefined;
     app: FunctionComponent;
     container: Element | DocumentFragment;
     context: GlobalContextParams | undefined;
-    constructor(app: FunctionComponent, container: Element | DocumentFragment, context?: GlobalContextParams);
+    rootCacheId: string | undefined;
+    constructor(app: FunctionComponent, container: Element | DocumentFragment, context?: GlobalContextParams, rootCacheId?: string, // root id in cache
+    root?: RootType);
     render: (props: any) => void;
+    setRootCache: () => void;
+    clearRootCache: () => void;
     unmount: () => void;
 }

package/esm/_helpers/render.js

@@ -1,13 +1,17 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import { render as copyRender } from './react-dom';
-export var ReactDOMRender = function ReactDOMRender(app, container, context) {
+export var renderRootCache = {};
+export var ReactDOMRender = function ReactDOMRender(app, container, context, rootCacheId, // root id in cache
+root // use root in cache
+) {
   var _this = this;
 
   this.root = void 0;
   this.app = void 0;
   this.container = void 0;
   this.context = void 0;
+  this.rootCacheId = void 0;
 
   this.render = function (props) {
     var CustomApp = _this.app;
@@ -23,14 +27,30 @@ export var ReactDOMRender = function ReactDOMRender(app, container, context) {
     }
   };
 
+  this.setRootCache = function () {
+    if (_this.rootCacheId) {
+      renderRootCache[_this.rootCacheId] = _this.root;
+    }
+  };
+
+  this.clearRootCache = function () {
+    if (_this.rootCacheId) {
+      delete renderRootCache[_this.rootCacheId];
+    }
+  };
+
   this.unmount = function () {
     var _this$root;
 
     (_this$root = _this.root) == null ? void 0 : _this$root._unmount();
     _this.root = undefined;
+
+    _this.clearRootCache();
   };
 
   this.app = app;
   this.container = container;
   this.context = context;
+  this.rootCacheId = rootCacheId;
+  this.root = root;
 };

package/esm/carousel/index.js

@@ -640,6 +640,9 @@ var Carousel = /*#__PURE__*/forwardRef(function (props, ref) {
 
   function getFakeChild() {
     if (noLoop) {
+      // 循环状态从有到无时，重置 transforms
+      // @en reset transforms when loop status changes to false
+      setTransforms([]);
       return;
     }
 

package/esm/image/style/index.less

@@ -1,11 +1,11 @@
-@import "../../../style/mixin.less";
+@import '../../../style/mixin.less';
 
 .@{prefix}-image {
     display: inline-block;
     position: relative;
 
     &.preview {
-        transition: all .3s ease-in-out;
+        transition: all 0.3s ease-in-out;
 
         .image-container,
         .image-loading-container .image-loading,
@@ -109,7 +109,6 @@
     }
 
     .image-error-container {
-
         .image-retry-load {
             position: absolute;
             top: 0;
@@ -127,7 +126,6 @@
     }
 
     .image-loading-container {
-
         .image-loading {
             position: absolute;
             top: 0;

package/esm/image-preview/methods.js

@@ -3,9 +3,7 @@ import { appendElementById, removeElement } from '@arco-design/mobile-utils';
 import { ReactDOMRender } from '../_helpers/render';
 export function open(Component) {
   return function (config, context) {
-    var baseProps = _extends({
-      unmountOnExit: true
-    }, config || {}, {
+    var baseProps = _extends({}, config || {}, {
       close: function close() {}
     }); // 不同的key用不同的容器挂载
     // @en Different keys are mounted in different containers
@@ -42,10 +40,7 @@ export function open(Component) {
 
     dynamicProps.onClose = function () {
       baseProps.onClose && baseProps.onClose();
-
-      if (baseProps.unmountOnExit) {
-        removeElement(div);
-      }
+      removeElement(div);
     };
 
     dynamicProps.openIndex = -1;

package/esm/masking/methods.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import { appendElementById, removeElement, nextTick } from '@arco-design/mobile-utils';
-import { ReactDOMRender } from '../_helpers/render';
+import { ReactDOMRender, renderRootCache } from '../_helpers/render';
 export function getOpenMethod(Component, containerId, normalize) {
   if (normalize === void 0) {
     normalize = function normalize(config) {
@@ -18,14 +18,14 @@ export function getOpenMethod(Component, containerId, normalize) {
 
 
     var id = "_" + (containerId || 'ARCO_MASKING') + "_DIV_" + (config.key || '') + "_";
-
-    var _appendElementById = appendElementById(id, baseProps.getContainer),
-        div = _appendElementById.child;
-
+    var existedDiv = baseProps.unmountOnExit ? null : document.getElementById(id);
+    var div = existedDiv || appendElementById(id, baseProps.getContainer).child;
     var leaving = false;
 
-    var _ReactDOMRender = new ReactDOMRender(Component, div, context),
-        render = _ReactDOMRender.render;
+    var _ReactDOMRender = new ReactDOMRender(Component, div, context, id, existedDiv ? renderRootCache[id] : undefined),
+        render = _ReactDOMRender.render,
+        unmount = _ReactDOMRender.unmount,
+        setRootCache = _ReactDOMRender.setRootCache;
 
     var dynamicProps = _extends({}, baseProps, {
       getContainer: function getContainer() {
@@ -50,11 +50,17 @@ export function getOpenMethod(Component, containerId, normalize) {
       baseProps.onClose && baseProps.onClose(scene);
 
       if (baseProps.unmountOnExit) {
+        unmount();
         removeElement(div);
       }
     };
 
     render(dynamicProps);
+
+    if (!baseProps.unmountOnExit) {
+      setRootCache();
+    }
+
     nextTick(function () {
       if (leaving) return;
       dynamicProps.visible = true;

package/esm/picker/index.js

@@ -95,12 +95,13 @@ var Picker = /*#__PURE__*/forwardRef(function (props, ref) {
 
     (_pickerViewRef$curren6 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren6.scrollToCurrentIndex();
     nextTick(function () {
-      var _pickerViewRef$curren7;
+      var _pickerViewRef$curren7, _pickerViewRef$curren8;
 
       var val = ((_pickerViewRef$curren7 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren7.getAllColumnValues()) || scrollValueRef.current || [];
+      var selectedData = ((_pickerViewRef$curren8 = pickerViewRef.current) == null ? void 0 : _pickerViewRef$curren8.getAllColumnData()) || [];
 
       if (onOk) {
-        onOk(val);
+        onOk(val, selectedData);
       }
 
       if (onChange) {

package/esm/picker/type.d.ts

@@ -81,7 +81,7 @@ export interface PickerProps extends Omit<PopupProps, 'visible' | 'close' | 'chi
      * 点击选中时执行的回调
      * @en Callback when clicking on Ok
      */
-    onOk?: (value: ValueType[]) => void;
+    onOk?: (value: ValueType[], data: PickerData[]) => void;
     /**
      * 点击取消时执行的回调
      * @en Callback when clicking to cancel

package/esm/picker-view/components/cascader.d.ts

@@ -19,6 +19,7 @@ export interface CascaderRef {
     getCellMovingStatus: () => PickerCellMovingStatus[];
     scrollToCurrentIndex: () => void;
     getAllCellsValue: () => ValueType[];
+    getAllCellsData: () => PickerData[];
 }
 declare const Cascader: React.ForwardRefExoticComponent<CascaderProps & React.RefAttributes<CascaderRef>>;
 export default Cascader;

package/esm/picker-view/components/cascader.js

@@ -22,7 +22,8 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
     return {
       getCellMovingStatus: getCellMovingStatus,
       scrollToCurrentIndex: scrollToCurrentIndex,
-      getAllCellsValue: getAllCellsValue
+      getAllCellsValue: getAllCellsValue,
+      getAllCellsData: getAllCellsData
     };
   });
 
@@ -44,6 +45,12 @@ var Cascader = /*#__PURE__*/forwardRef(function (props, ref) {
     });
   }
 
+  function getAllCellsData() {
+    return pickerCellsRef.current.map(function (cell) {
+      return cell.getCurrentCellData();
+    });
+  }
+
   function _onValueChange(value, index, newData) {
     var children = arrayTreeFilter(data, function (item, level) {
       return level <= index && item.value === value[level];

package/esm/picker-view/components/picker-cell.d.ts

@@ -22,6 +22,7 @@ export interface PickerCellRef {
     movingStatus: PickerCellMovingStatus;
     scrollToCurrentIndex: () => void;
     getCurrentCellValue: () => ValueType;
+    getCurrentCellData: () => PickerData;
 }
 declare const PickerCell: React.ForwardRefExoticComponent<PickerCellProps & React.RefAttributes<PickerCellRef>>;
 export default PickerCell;

package/esm/picker-view/components/picker-cell.js

@@ -289,6 +289,10 @@ var PickerCell = /*#__PURE__*/forwardRef(function (props, ref) {
     return (_data$currentIndex = data[currentIndex]) == null ? void 0 : _data$currentIndex.value;
   }
 
+  function getCurrentCellData() {
+    return data[currentIndex];
+  }
+
   function _clearTimer() {
     timeRef.current && clearTimeout(timeRef.current);
     timeRef.current = null;
@@ -354,7 +358,8 @@ var PickerCell = /*#__PURE__*/forwardRef(function (props, ref) {
     return {
       movingStatus: movingStatusRef.current,
       scrollToCurrentIndex: scrollToCurrentIndex,
-      getCurrentCellValue: getCurrentCellValue
+      getCurrentCellValue: getCurrentCellValue,
+      getCurrentCellData: getCurrentCellData
     };
   });
   return !hideEmptyCols || data && data.length ? /*#__PURE__*/React.createElement("div", {

package/esm/picker-view/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import MultiPicker from '../picker-view/components/multi-picker';
 import PickerCell from '../picker-view/components/picker-cell';
 import Cascader from '../picker-view/components/cascader';
-import { PickerViewProps, ValueType, PickerCellMovingStatus } from './type';
+import { PickerViewProps, ValueType, PickerData, PickerCellMovingStatus } from './type';
 export * from './type';
 export { MultiPicker, PickerCell, Cascader };
 export interface PickerViewRef {
@@ -41,6 +41,11 @@ export interface PickerViewRef {
      * @en Jump directly to the current most recent line (will break scrolling when called)
      */
     scrollToCurrentIndex: () => void;
+    /**
+     * 获取所有列的 data
+     * @en Get all column data
+     */
+    getAllColumnData: () => PickerData[];
 }
 declare const _default: React.ForwardRefExoticComponent<PickerViewProps & React.RefAttributes<PickerViewRef>> & {
     displayName?: string | undefined;

package/esm/picker-view/index.js

@@ -8,6 +8,15 @@ import Cascader from '../picker-view/components/cascader';
 import { useMountedState } from '../_helpers';
 export * from './type';
 export { MultiPicker, PickerCell, Cascader };
+
+var isArray = function isArray(dt) {
+  return dt ? Array.isArray(dt[0]) : false;
+};
+
+var isStrOrNum = function isStrOrNum(dt) {
+  return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
+};
+
 var PickerView = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$className = props.className,
       className = _props$className === void 0 ? '' : _props$className,
@@ -57,14 +66,6 @@ var PickerView = /*#__PURE__*/forwardRef(function (props, ref) {
   var innerData = useMemo(function () {
     var newData;
 
-    var isArray = function isArray(dt) {
-      return dt ? Array.isArray(dt[0]) : false;
-    };
-
-    var isStrOrNum = function isStrOrNum(dt) {
-      return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
-    };
-
     if (isArray(data)) {
       if (isStrOrNum(data)) {
         newData = data.map(function (item) {
@@ -98,6 +99,17 @@ var PickerView = /*#__PURE__*/forwardRef(function (props, ref) {
     });
   };
 
+  var getAllColumnData = function getAllColumnData() {
+    var _cascaderRef$current2;
+
+    var curValues = cascade ? ((_cascaderRef$current2 = cascaderRef.current) == null ? void 0 : _cascaderRef$current2.getAllCellsData()) || [] : pickerCellsRef.current.map(function (cell) {
+      return cell.getCurrentCellData();
+    });
+    return curValues.filter(function (v) {
+      return v !== undefined;
+    });
+  };
+
   function getColumnValue(index) {
     if (index === void 0) {
       index = 0;
@@ -107,18 +119,18 @@ var PickerView = /*#__PURE__*/forwardRef(function (props, ref) {
   }
 
   function getCellMovingStatus() {
-    var _cascaderRef$current2;
+    var _cascaderRef$current3;
 
-    return cascade ? ((_cascaderRef$current2 = cascaderRef.current) == null ? void 0 : _cascaderRef$current2.getCellMovingStatus()) || [] : pickerCellsRef.current.map(function (cell) {
+    return cascade ? ((_cascaderRef$current3 = cascaderRef.current) == null ? void 0 : _cascaderRef$current3.getCellMovingStatus()) || [] : pickerCellsRef.current.map(function (cell) {
       return cell.movingStatus;
     });
   }
 
   function scrollToCurrentIndex() {
     if (cascade) {
-      var _cascaderRef$current3;
+      var _cascaderRef$current4;
 
-      (_cascaderRef$current3 = cascaderRef.current) == null ? void 0 : _cascaderRef$current3.scrollToCurrentIndex();
+      (_cascaderRef$current4 = cascaderRef.current) == null ? void 0 : _cascaderRef$current4.scrollToCurrentIndex();
       return;
     }
 
@@ -135,7 +147,8 @@ var PickerView = /*#__PURE__*/forwardRef(function (props, ref) {
       getColumnValue: getColumnValue,
       updateLayout: updateLayout,
       resetValue: resetValue,
-      scrollToCurrentIndex: scrollToCurrentIndex
+      scrollToCurrentIndex: scrollToCurrentIndex,
+      getAllColumnData: getAllColumnData
     };
   });
 

package/esm/skeleton/type.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { BaseProps, SimpleBaseProps } from '../_helpers';
-export { BaseProps, SimpleBaseProps };
+export type { BaseProps, SimpleBaseProps };
 export interface SkeletonProps extends SimpleBaseProps {
     /**
      * 是否显示标题占位图

package/esm/skeleton/type.js

@@ -1,2 +1 @@
-import { BaseProps, SimpleBaseProps } from '../_helpers';
-export { BaseProps, SimpleBaseProps };
+export {};

package/esm/tabs/tab-cell.js

@@ -73,14 +73,18 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
     return tabs.length < overflowThreshold ? tabBarArrange : 'start';
   }),
       originArrange = _useState3[0],
-      setOriginArrange = _useState3[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
+      setOriginArrange = _useState3[1];
 
+  var _useState4 = useState(false),
+      forceUpdate = _useState4[0],
+      setForceUpdate = _useState4[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏，大于overflowThreshold个时开启
 
-  var _useState4 = useState(function () {
+
+  var _useState5 = useState(function () {
     return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
   }),
-      showTab = _useState4[0],
-      setShowTab = _useState4[1];
+      showTab = _useState5[0],
+      setShowTab = _useState5[1];
 
   var isVertical = tabDirection === 'vertical';
   var isLine = (type || '').indexOf('line') !== -1;
@@ -95,6 +99,15 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
   var hasDivider = tabBarHasDivider === void 0 ? isLine : tabBarHasDivider;
   var wrapSize = isVertical ? wrapWidth : wrapHeight;
   var system = useSystem();
+
+  var updateScrollPosition = function updateScrollPosition() {
+    if (wrapSize && tabBarScrollChance !== 'none') {
+      setTimeout(function () {
+        scrollToCenter();
+      }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
+    }
+  };
+
   useEffect(function () {
     nextTick(function () {
       setCellOverflow(); // dom出来之后originArrange置空，交由tabBarArrange控制
@@ -114,31 +127,16 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
       (_underlineRef$current = underlineRef.current) == null ? void 0 : _underlineRef$current.resetUnderlineStyle();
     });
   }, [activeIndex, tabs, getCellPadding('left'), getCellPadding('right'), tabBarGutter, tabDirection]);
-  useImperativeHandle(ref, function () {
-    return {
-      dom: domRef.current,
-      scrollTo: scrollTo,
-      scrollToCenter: scrollToCenter,
-      hasOverflow: hasOverflow,
-      setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
-        var _underlineRef$current2;
-
-        return (_underlineRef$current2 = underlineRef.current) == null ? void 0 : _underlineRef$current2.setCaterpillarAnimate(ratio);
-      },
-      resetUnderlineStyle: function resetUnderlineStyle() {
-        var _underlineRef$current3;
-
-        return (_underlineRef$current3 = underlineRef.current) == null ? void 0 : _underlineRef$current3.resetUnderlineStyle();
-      }
-    };
-  }, [scrollToCenter, scrollTo, hasOverflow]);
   useEffect(function () {
-    if (wrapSize && tabBarScrollChance !== 'none') {
-      setTimeout(function () {
-        scrollToCenter();
-      }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
-    }
+    updateScrollPosition();
   }, [activeIndex, wrapSize]);
+  useEffect(function () {
+    var _underlineRef$current2;
+
+    setCellOverflow();
+    (_underlineRef$current2 = underlineRef.current) == null ? void 0 : _underlineRef$current2.resetUnderlineStyle();
+    updateScrollPosition();
+  }, [forceUpdate]);
   useEffect(function () {
     tabBarScrollChance !== 'none' && scrollToCenter(true); // TabCell左右可滚动时，防止触发父级touchmove事件导致滚不动
     // @en When the TabCell can be scrolled left and right, prevent the parent touchmove event from being triggered which result in inability to scroll
@@ -279,7 +277,7 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
     return typeof tab === 'string' ? tab : tab.title;
   }
 
-  function renderTabUnderline() {
+  var renderTabUnderline = function renderTabUnderline() {
     if (!showUnderline || !isLine) {
       return null;
     }
@@ -310,7 +308,7 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
       getTabCenterLeft: getTabCenterLeft,
       getTabRect: getTabRect
     }, lineProps));
-  }
+  };
 
   var cellInner = /*#__PURE__*/React.createElement(React.Fragment, null, tabs.map(function (tab, index) {
     return /*#__PURE__*/React.createElement("div", {
@@ -352,6 +350,34 @@ var TabCell = /*#__PURE__*/forwardRef(function (props, ref) {
       height: '100%'
     }
   }) : null);
+
+  var _updateLayout = function updateLayout() {
+    setForceUpdate(function (val) {
+      return !val;
+    });
+  };
+
+  useImperativeHandle(ref, function () {
+    return {
+      dom: domRef.current,
+      scrollTo: scrollTo,
+      scrollToCenter: scrollToCenter,
+      hasOverflow: hasOverflow,
+      setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
+        var _underlineRef$current3;
+
+        return (_underlineRef$current3 = underlineRef.current) == null ? void 0 : _underlineRef$current3.setCaterpillarAnimate(ratio);
+      },
+      resetUnderlineStyle: function resetUnderlineStyle() {
+        var _underlineRef$current4;
+
+        return (_underlineRef$current4 = underlineRef.current) == null ? void 0 : _underlineRef$current4.resetUnderlineStyle();
+      },
+      updateLayout: function updateLayout() {
+        return _updateLayout();
+      }
+    };
+  }, [scrollToCenter, scrollTo, hasOverflow]);
   return /*#__PURE__*/React.createElement("div", {
     className: cls(prefix + "-container-wrap", tabDirection, "type-" + type, tabBarClass, system),
     style: tabBarStyle

package/esm/tabs/type.d.ts

@@ -565,6 +565,11 @@ export interface TabCellRef {
      * @en Recalculate underline style
      */
     resetUnderlineStyle: () => void;
+    /**
+     * 强制更新 tab-cell
+     * @en Force update tab-cell
+     */
+    updateLayout: () => void;
 }
 export interface TabPaneProps extends Pick<TabsProps, 'duration' | 'transitionDuration' | 'lazyloadCount' | 'hideContentStyle' | 'renderHideContent' | 'mode' | 'tabPaneClass' | 'tabPaneStyle' | 'tabPaneExtra' | 'getScrollContainer' | 'scrollThrottle' | 'scrollOffset' | 'goLastWhenScrollBottom' | 'scrollVertical' | 'translateZ' | 'fullScreen' | 'autoHeight' | 'onScroll' | 'swipeEnergySaving'> {
     prefixCls?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@arco-design/mobile-react",
-    "version": "2.30.8",
+    "version": "2.30.10",
     "description": "",
     "main": "cjs/index.js",
     "module": "esm/index.js",
@@ -15,7 +15,7 @@
     "author": "taoyiyue@bytedance.com",
     "license": "ISC",
     "dependencies": {
-        "@arco-design/mobile-utils": "2.17.8",
+        "@arco-design/mobile-utils": "2.17.10",
         "@arco-design/transformable": "^1.0.0",
         "lodash.throttle": "^4.1.1",
         "resize-observer-polyfill": "^1.5.1"
@@ -49,5 +49,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "2838b15919944eb0a2122b01cb1a9e8e0e0af75a"
+    "gitHead": "70e0f287b7e294b0d2d8e1516e4ff614f212f7dd"
 }

package/umd/_helpers/render.d.ts

@@ -1,12 +1,17 @@
 import { FunctionComponent } from 'react';
 import { RootType } from './react-dom';
 import { GlobalContextParams } from '../context-provider';
+export declare const renderRootCache: Record<string, RootType | undefined>;
 export declare class ReactDOMRender {
     root: RootType | undefined;
     app: FunctionComponent;
     container: Element | DocumentFragment;
     context: GlobalContextParams | undefined;
-    constructor(app: FunctionComponent, container: Element | DocumentFragment, context?: GlobalContextParams);
+    rootCacheId: string | undefined;
+    constructor(app: FunctionComponent, container: Element | DocumentFragment, context?: GlobalContextParams, rootCacheId?: string, // root id in cache
+    root?: RootType);
     render: (props: any) => void;
+    setRootCache: () => void;
+    clearRootCache: () => void;
     unmount: () => void;
 }

package/umd/_helpers/render.js

@@ -16,17 +16,22 @@
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
   _exports.__esModule = true;
-  _exports.ReactDOMRender = void 0;
+  _exports.renderRootCache = _exports.ReactDOMRender = void 0;
   _extends2 = _interopRequireDefault(_extends2);
   _react = _interopRequireDefault(_react);
+  var renderRootCache = {};
+  _exports.renderRootCache = renderRootCache;
 
-  var ReactDOMRender = function ReactDOMRender(app, container, context) {
+  var ReactDOMRender = function ReactDOMRender(app, container, context, rootCacheId, // root id in cache
+  root // use root in cache
+  ) {
     var _this = this;
 
     this.root = void 0;
     this.app = void 0;
     this.container = void 0;
     this.context = void 0;
+    this.rootCacheId = void 0;
 
     this.render = function (props) {
       var CustomApp = _this.app;
@@ -41,16 +46,32 @@
       }
     };
 
+    this.setRootCache = function () {
+      if (_this.rootCacheId) {
+        renderRootCache[_this.rootCacheId] = _this.root;
+      }
+    };
+
+    this.clearRootCache = function () {
+      if (_this.rootCacheId) {
+        delete renderRootCache[_this.rootCacheId];
+      }
+    };
+
     this.unmount = function () {
       var _this$root;
 
       (_this$root = _this.root) == null ? void 0 : _this$root._unmount();
       _this.root = undefined;
+
+      _this.clearRootCache();
     };
 
     this.app = app;
     this.container = container;
     this.context = context;
+    this.rootCacheId = rootCacheId;
+    this.root = root;
   };
 
   _exports.ReactDOMRender = ReactDOMRender;

package/umd/carousel/index.js

@@ -660,6 +660,9 @@
 
     function getFakeChild() {
       if (noLoop) {
+        // 循环状态从有到无时，重置 transforms
+        // @en reset transforms when loop status changes to false
+        setTransforms([]);
         return;
       }