Open code00Way opened 1 year ago
dv-scroll-board
function getWaringTableDataTemplate() { let data = []; data.push(['']) return { data: data, oddRowBGC: 'FFF-FFF00', evenRowBGC: 'FFF-FFF00', waitTime: 10000, rowNum:3, index: true, columnWidth: [25], align: ['left'], } }
更新数据是通过websocket推送的,推送有可能会连续推多次,且间隔较小。通过观察源码发现,如果一开始动画是停止的,updateRows方法会调用 开启动画方法进行数据更新,但是中间又有阻塞的操作,可能会导致后续定时器多次执行发生动画抽搐和变速。
waringTableRender(data) { const formatDate = 'YYYY-MM-DD HH:mm:ss'; // 定义日期格式 let dataArr = []; let _this = this; data.map(i => { let arr = []; let {ipAddress, warnTitle, createTime,warnRule,warnLevel,appName} = i; let colorClass = 'info-waring' switch (warnLevel) { case 'warn': colorClass='warn-waring'; break; case 'error': colorClass='error-waring' break; } let tip = 服务器${ipAddress}的 ${appName} 在${moment(createTime).format(formatDate)} 触发 ${warnTitle} 预警,告警表达式结果为${warnRule}; arr.push(<div class="${colorClass}">${tip}</div>) dataArr.push(arr) })
服务器${ipAddress}的 ${appName} 在${moment(createTime).format(formatDate)} 触发 ${warnTitle} 预警,告警表达式结果为${warnRule}
<div class="${colorClass}">${tip}</div>
if (this.waringTotal ===0 && dataArr.length>0){ _this.$refs['waring-audio'].removeAttribute('muted'); _this.$refs['waring-audio'].play(); }else if (this.waringTotal >0 && dataArr.length===0){ _this.$refs['waring-audio'].pause(); } this.waringTotal = dataArr.length; _this.$refs['waringTableDataScrollBoard'].updateRows(dataArr); },
无
稳定运行
偶尔发生抖动变速
Bug report
出现Bug的组件?
dv-scroll-board
组件配置数据?
更新数据是通过websocket推送的,推送有可能会连续推多次,且间隔较小。通过观察源码发现,如果一开始动画是停止的,updateRows方法会调用 开启动画方法进行数据更新,但是中间又有阻塞的操作,可能会导致后续定时器多次执行发生动画抽搐和变速。
waringTableRender(data) { const formatDate = 'YYYY-MM-DD HH:mm:ss'; // 定义日期格式 let dataArr = []; let _this = this; data.map(i => { let arr = []; let {ipAddress, warnTitle, createTime,warnRule,warnLevel,appName} = i; let colorClass = 'info-waring' switch (warnLevel) { case 'warn': colorClass='warn-waring'; break; case 'error': colorClass='error-waring' break; } let tip =
服务器${ipAddress}的 ${appName} 在${moment(createTime).format(formatDate)} 触发 ${warnTitle} 预警,告警表达式结果为${warnRule}
; arr.push(<div class="${colorClass}">${tip}</div>
) dataArr.push(arr) })控制台错误输出?
无
期望情况?
稳定运行
实际情况?
偶尔发生抖动变速
其他相关信息