前言: 在工作中大部分同事为了减少自己的工作量 , 都会在更改数据结构方面比较难以退步。(奶茶到位,情商高,帅哥美女,同事友善另说) 那么就需要我们自己手动添加并且修改的话,可以看看本文找找灵感
正文:
当你的后端传来的数据格式是这样的:
data(){
return {
bullet:[
{bullet:"弹幕内容1"},
{bullet:"弹幕内容2"},
{bullet:"弹幕内容3"},
...
]
}
}
而我们需要的数据结构格式是这样的:
data(){
return {
bullet:[
{bullet:"弹幕内容1",speed:Math.random()*1+1,x:画布宽度,y:随机高度},
{bullet:"弹幕内容2",speed:Math.random()*1+1,x:画布宽度,y:随机高度},
{bullet:"弹幕内容3",speed:Math.random()*1+1,x:画布宽度,y:随机高度},
...
]
}
}
这里可以使用Object.assign去合并代码:
this.bullet = this.bullet.map(item=>{
return Object.assign(item,{
speed:Math.random()*1+1,
x: 750,
y: Math.random()*100+20
}
)
})
就能把图1的数据格式变成图2啦~
有时候真的感觉我干货满满,不水文字呢~