VueUiKpi component does not refresh when responsive data changes

[salarxiao321]

• "vue": "^3.3.7"
• "vue-data-ui": "^2.3.17" or "vue-data-ui": "^2.3.24"

`

<script setup> import { ref } from "vue"; import { VueDataUi } from "vue-data-ui"; import "vue-data-ui/style.css"; const config = ref({ animationFrames: 60, animationValueStart: 0, backgroundColor: "#FFFFFF", fontFamily: "inherit", layoutClass: "p-4 m-4 rounded-md shadow", layoutCss: "", prefix: "", suffix: "", title: "Title", titleBold: true, titleColor: "#1A1A1A", titleClass: "", titleCss: "", titleFontSize: 16, useAnimation: true, valueBold: true, valueColor: "#6376DD", valueClass: "", valueCss: "", valueFontSize: 32, valueRounding: 0, }); const dataset = ref(18); // 生成 1 到 20 之间的随机数 const getRandomNumber = () => { return Math.floor(Math.random() * 20) + 1; }; // 定时更新 dataset 的值 const updateDataset = () => { dataset.value = getRandomNumber(); }; // 设置定时器 let intervalId; const startTimer = () => { intervalId = setInterval(updateDataset, 5000); // 每 5 秒更新一次 }; const stopTimer = () => { if (intervalId) { clearInterval(intervalId); } }; // 在组件挂载时启动定时器 onMounted(() => { startTimer(); }); // 在组件卸载时停止定时器 onUnmounted(() => { stopTimer(); }); </script>

{{ dataset }}

`

[graphieros]

Hi @salarxiao321

You can upgrade to v2.3.25 which fixes this issue.
The displayed data will change (and animate if config says so) when props.dataset changes.