@hi-ui/cascader 4.5.1 → 4.5.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/lib/cjs/CascaderMenuList.js +15 -13
  3. package/lib/esm/CascaderMenuList.js +16 -14
  4. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @hi-ui/cascader
2
2
 
3
+ ## 4.5.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#3415](https://github.com/XiaoMi/hiui/pull/3415) [`e7a09db`](https://github.com/XiaoMi/hiui/commit/e7a09db7f75022fee82a254a74a2ec17c6b03638) Thanks [@zyprepare](https://github.com/zyprepare)! - fix(cascader): 修复在异步加载数据下,首次打开弹窗没有定位到已选节点位置的问题 (#3414)
8
+
3
9
  ## 4.5.1
4
10
 
5
11
  ### Patch Changes
package/lib/cjs/CascaderMenuList.js CHANGED
@@ -77,23 +77,25 @@ var CascaderMenu = function CascaderMenu(_ref) {
77
77
  getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
78
78
  var cls = classname.cx(prefixCls, className);
79
79
  var activeNodeRef = React.useRef();
80
- var rafId = React.useRef(0);
80
+ var _useState = React.useState(null),
81
+ activeNode = _useState[0],
82
+ setActiveNode = _useState[1];
83
+ var timeoutId = React.useRef(null);
81
84
  React.useEffect(function () {
82
- if (activeNodeRef.current) {
83
- // 每次打开菜单时，滚动到选中的节点，双重 requestAnimationFrame 确保 DOM 已经渲染后再滚动
84
- rafId.current = requestAnimationFrame(function () {
85
- rafId.current = requestAnimationFrame(function () {
86
- scrollIntoView__default["default"](activeNodeRef.current, {
87
- scrollMode: 'if-needed',
88
- block: 'center'
89
- });
85
+ if (activeNode) {
86
+ timeoutId.current = setTimeout(function () {
87
+ scrollIntoView__default["default"](activeNode, {
88
+ scrollMode: 'if-needed',
89
+ block: 'center'
90
90
  });
91
- });
91
+ }, 100);
92
92
  }
93
93
  return function () {
94
- cancelAnimationFrame(rafId.current);
94
+ if (timeoutId.current) {
95
+ clearTimeout(timeoutId.current);
96
+ }
95
97
  };
96
- }, [activeNodeRef]);
98
+ }, [activeNode, activeNodeRef]);
97
99
  return /*#__PURE__*/React__default["default"].createElement("ul", {
98
100
  className: cls,
99
101
  style: style,
@@ -108,7 +110,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
108
110
  return /*#__PURE__*/React__default["default"].createElement("li", {
109
111
  ref: function ref(node) {
110
112
  if (node && active) {
111
- activeNodeRef.current = node;
113
+ setActiveNode(node);
112
114
  }
113
115
  },
114
116
  key: option.id,
package/lib/esm/CascaderMenuList.js CHANGED
@@ -8,7 +8,7 @@
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
10
  import { __rest } from 'tslib';
11
- import React, { forwardRef, useRef, useEffect } from 'react';
11
+ import React, { forwardRef, useRef, useState, useEffect } from 'react';
12
12
  import { getPrefixCls, cx } from '@hi-ui/classname';
13
13
  import { __DEV__ } from '@hi-ui/env';
14
14
  import { defaultLoadingIcon, defaultSuffixIcon, defaultLeafIcon } from './icons/index.js';
@@ -64,23 +64,25 @@ var CascaderMenu = function CascaderMenu(_ref) {
64
64
  getItemRequiredProps = _useCascaderContext2.getItemRequiredProps;
65
65
  var cls = cx(prefixCls, className);
66
66
  var activeNodeRef = useRef();
67
- var rafId = useRef(0);
67
+ var _useState = useState(null),
68
+ activeNode = _useState[0],
69
+ setActiveNode = _useState[1];
70
+ var timeoutId = useRef(null);
68
71
  useEffect(function () {
69
- if (activeNodeRef.current) {
70
- // 每次打开菜单时，滚动到选中的节点，双重 requestAnimationFrame 确保 DOM 已经渲染后再滚动
71
- rafId.current = requestAnimationFrame(function () {
72
- rafId.current = requestAnimationFrame(function () {
73
- scrollIntoView(activeNodeRef.current, {
74
- scrollMode: 'if-needed',
75
- block: 'center'
76
- });
72
+ if (activeNode) {
73
+ timeoutId.current = setTimeout(function () {
74
+ scrollIntoView(activeNode, {
75
+ scrollMode: 'if-needed',
76
+ block: 'center'
77
77
  });
78
- });
78
+ }, 100);
79
79
  }
80
80
  return function () {
81
- cancelAnimationFrame(rafId.current);
81
+ if (timeoutId.current) {
82
+ clearTimeout(timeoutId.current);
83
+ }
82
84
  };
83
- }, [activeNodeRef]);
85
+ }, [activeNode, activeNodeRef]);
84
86
  return /*#__PURE__*/React.createElement("ul", {
85
87
  className: cls,
86
88
  style: style,
@@ -95,7 +97,7 @@ var CascaderMenu = function CascaderMenu(_ref) {
95
97
  return /*#__PURE__*/React.createElement("li", {
96
98
  ref: function ref(node) {
97
99
  if (node && active) {
98
- activeNodeRef.current = node;
100
+ setActiveNode(node);
99
101
  }
100
102
  },
101
103
  key: option.id,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/cascader",
3
- "version": "4.5.1",
3
+ "version": "4.5.2",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HiUI <mi-hiui@xiaomi.com>",