VisActor
[Bug] 缩放父元素会导致图表执行了多次
Version
1.13.7
Link to Minimal Reproduction
缩放父元素并不会导致RecentlyVisited组件重新渲染,但是图表却执行了多次
Steps to Reproduce
import { useEffect, useRef } from "react"; import { Card } from "antd"; import { AreaChart, type VChartCore, type ISpec } from "@visactor/react-vchart";
import type { RecentlyVisiteData } from "./types";
const data: RecentlyVisiteData[] = [ { date: "2024-10-01", value: 3 }, { date: "2024-10-02", value: 4 }, { date: "2024-10-03", value: 100 }, { date: "2024-10-04", value: 5 }, { date: "2024-10-05", value: 60 }, { date: "2024-10-06", value: 6 }, { date: "2024-10-07", value: 7 }, { date: "2024-10-08", value: 2 }, { date: "2024-10-09", value: 113 }, ];
const spec = { type: "area", data: { id: "recentlyVisite", values: [], }, xField: "date", yField: "value", line: { style: { curveType: "monotone", }, }, } as ISpec;
// 最近访问 export default function RecentlyVisited() { const chartRef = useRef<VChartCore>(null); useEffect(() => { const timer = setTimeout(() => { chartRef.current?.updateData("recentlyVisite", data, undefined, { reAnimate: true }); }, 500); const chartInstance = chartRef.current; return () => { chartInstance?.release(); clearTimeout(timer); }; }, []);
return ( <Card title="最近访问"> <AreaChart ref={chartRef} spec={spec} /> </Card> ); } 缩放父元素并不会导致RecentlyVisited组件重新渲染,但是图表却执行了多次
Current Behavior
缩放父元素并不会导致RecentlyVisited组件重新渲染,但是图表却执行了多次
Expected Behavior
缩放父元素并不会导致RecentlyVisited组件重新渲染,但是图表却执行了多次
Environment
- OS:
- Browser:
- Framework:
Any additional comments?
缩放父元素并不会导致RecentlyVisited组件重新渲染,但是图表却执行了多次
@xiaoluoHe resize 触发的动画可以关掉吗？同步一下配置吧
gif 看上去重复执行的是 appear 动画。
目测是代码里 updateSpec 第四个参数{ reAnimate: true }设置问题，可以去掉试一下
