vue中,每一秒一个data,如何保存所有data,并一次只要8条数据?
在监听里每一秒会返回一个data,一个data长度有65位,总共大概会返回30个,我也是每一秒实时都要显示数据,一次显示8位,得按顺序来,然后得考虑到有奇数偶数的情况,假设最终只剩7条(或不足8条),就7条一起显示
怎么样保留之后的数据并实时截取呢?
举例子↓
uni.$on('getData', (obj) => {
let data = ['aa','bb','cc','dd','ee','ff']
// let data = ['hh','ii','jj','kk','ll','mm'] //第二次返回
//...期待结果↓
let result = ['aa','bb','cc'] //第一次显示
// let result = ['dd','ee','ff'] //第二次显示
// let result = ['hh','ii','jj'] //第三次显示
// let result = ['kk','ll','mm'] //第四次显示
})
这里可以不看,大伙可以这样理解,服务器每秒会返回给我一段心率波形的data,一段有65个点来组成波形图,总共会发送30秒大概一秒一个data,但我不可能一次显示65个点在图标上,所以每隔8个来裁剪,我也不可能等30秒之后再全部push到一个新data里再来每8位裁剪。现在的问题就是我不知道怎么在data实时更新的情况下,记忆之前裁剪的位置并继续裁剪
小弟在这里先感谢各位大神们,感激不尽,祝大神们发财祝大神们取漂亮老婆
回复
1个回答
test
2024-06-27
// 可以理解为:
// 1.最后的结果是 [[]] 的数组,二阶数组数量:30
// 2.二阶数组长度 n 个
// 3.不用考虑缓存回收,30秒结束后销毁所有的数据
// 4.单个数组的重新切分为长度为 8 的新的数组
// 5.单数组长度不足8的用 null 补充
const len = 8;
const data = ref([]);
let index = ref(0);
// 切割单个数据
const splitHeart = list => {
let temp = [];
const fillLen = len - (list.length % - len);
list.push(...new Array(fillLen).fill(null));
list.map((item, index) => {
const key = Math.floor(index / 8);
temp[key] = temp[key] || [];
temp[key].push(item);
})
return temp
}
// 获取单组数据的时候丢到总的去
const getHeartData = list => {
list = list || new Array(65).fill(1);
data.value.push(...splitHeart(list))
}
// 显示到页面的数据
// 按指针来,指针按你自己的需求设计 index
// 或者按你那边预期的规则来
const showData = computed(
() => data.value[index.value]
)
回复
适合作为回答的
- 经过验证的有效解决办法
- 自己的经验指引,对解决问题有帮助
- 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
- 询问内容细节或回复楼层
- 与题目无关的内容
- “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容