vue.js动态渲染CSS

如图所示总共八个盒子，现在有12个颜色，我想给这8个盒子的background分别设置一个随机颜色，颜色从十二个颜色里取，请问这个逻辑该怎么写？

const colorLists = ['red', 'yellow',...]
<div  :style="{'background-color':colorLists[Math.floor(Math.random()*12)]}"></div>

把颜色 值放到 数组里 。然后利用 random 随机 一个下标 然后 arr[下标]就行