@easyv/charts 1.3.24 → 1.3.25
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.
|
@@ -26,6 +26,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
26
26
|
style = props.style,
|
|
27
27
|
_props$speed = props.speed,
|
|
28
28
|
speed = _props$speed === void 0 ? 5 : _props$speed;
|
|
29
|
+
var rootRef = ref || (0, _react.useRef)();
|
|
29
30
|
var target = (0, _react.useRef)(null);
|
|
30
31
|
var observe = (0, _react.useRef)(null);
|
|
31
32
|
var speed_ = (0, _react.useRef)(0); //这里必须用一个ref绑定speed，否则animation中获取不到最新的speed
|
|
@@ -55,7 +56,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
55
56
|
observe.current = new IntersectionObserver(function (entries) {
|
|
56
57
|
var entrie = entries[0];
|
|
57
58
|
|
|
58
|
-
if (entrie.boundingClientRect.width < entrie.rootBounds.width
|
|
59
|
+
if (entrie.boundingClientRect.width < entrie.rootBounds.width) {
|
|
59
60
|
//表示文字全部可视
|
|
60
61
|
cancelAnimationFrame(timer.current);
|
|
61
62
|
target.current.style.transform = "translate(0px,0px)"; //重置偏移
|
|
@@ -72,7 +73,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
72
73
|
}
|
|
73
74
|
}
|
|
74
75
|
}, {
|
|
75
|
-
root:
|
|
76
|
+
root: rootRef.current,
|
|
76
77
|
rootMargin: "0px 0px 0px 0px",
|
|
77
78
|
threshold: new Array(101).fill(0).map(function (d, i) {
|
|
78
79
|
return i / 100;
|
|
@@ -97,7 +98,7 @@ var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef
|
|
|
97
98
|
overflow: "hidden",
|
|
98
99
|
justifyContent: overflow ? "start" : style.justifyContent || ""
|
|
99
100
|
}),
|
|
100
|
-
ref:
|
|
101
|
+
ref: rootRef
|
|
101
102
|
}, textList.map(function (item, i) {
|
|
102
103
|
return /*#__PURE__*/React.createElement("span", {
|
|
103
104
|
key: i,
|
package/package.json
CHANGED
|
@@ -12,6 +12,7 @@ export default memo(forwardRef((props, ref) => {
|
|
|
12
12
|
speed = 5, // 动画速度
|
|
13
13
|
} = props;
|
|
14
14
|
|
|
15
|
+
const rootRef = ref || useRef();
|
|
15
16
|
const target = useRef(null);
|
|
16
17
|
const observe = useRef(null);
|
|
17
18
|
const speed_ = useRef(0); //这里必须用一个ref绑定speed，否则animation中获取不到最新的speed
|
|
@@ -29,14 +30,12 @@ export default memo(forwardRef((props, ref) => {
|
|
|
29
30
|
timer.current = requestAnimationFrame(animation);
|
|
30
31
|
}
|
|
31
32
|
|
|
32
|
-
|
|
33
33
|
useEffect(() => {
|
|
34
34
|
//初始化观察器，利用观察器来监视组件可视区域变化
|
|
35
35
|
observe.current = new IntersectionObserver(
|
|
36
36
|
function (entries) {
|
|
37
37
|
let entrie = entries[0];
|
|
38
|
-
|
|
39
|
-
if (entrie.boundingClientRect.width < entrie.rootBounds.width >= 1) {
|
|
38
|
+
if (entrie.boundingClientRect.width < entrie.rootBounds.width) {
|
|
40
39
|
//表示文字全部可视
|
|
41
40
|
cancelAnimationFrame(timer.current);
|
|
42
41
|
target.current.style.transform = "translate(0px,0px)"; //重置偏移
|
|
@@ -53,7 +52,7 @@ export default memo(forwardRef((props, ref) => {
|
|
|
53
52
|
}
|
|
54
53
|
},
|
|
55
54
|
{
|
|
56
|
-
root:
|
|
55
|
+
root: rootRef.current,
|
|
57
56
|
rootMargin: "0px 0px 0px 0px",
|
|
58
57
|
threshold: new Array(101).fill(0).map((d, i) => i / 100), //这里设置了[0-1]之间所有的阈值，保证每一帧的变化都能被观察到
|
|
59
58
|
}
|
|
@@ -66,7 +65,6 @@ export default memo(forwardRef((props, ref) => {
|
|
|
66
65
|
observe.current.disconnect();
|
|
67
66
|
};
|
|
68
67
|
}, []);
|
|
69
|
-
|
|
70
68
|
let textList = [value, value];
|
|
71
69
|
return (
|
|
72
70
|
<div
|
|
@@ -78,7 +76,7 @@ export default memo(forwardRef((props, ref) => {
|
|
|
78
76
|
overflow: "hidden",
|
|
79
77
|
justifyContent: overflow ? "start" : style.justifyContent || "",
|
|
80
78
|
}}
|
|
81
|
-
ref={
|
|
79
|
+
ref={rootRef}
|
|
82
80
|
>
|
|
83
81
|
{textList.map((item, i) => {
|
|
84
82
|
return (
|