vueBaberrage如何实现随机颜色

在Vue.js中使用vue-baberrage实现随机颜色，可以通过设置`color`属性来实现。具体步骤如下：

1. 创建一个数组，包含多种颜色值，例如：`['#ff0000', '#00ff00', '#0000ff']`。
2. 在`mounted`钩子函数中，使用JavaScript的随机数函数`Math.random()`生成一个随机数，再将其乘以颜色数组的长度，取整数部分作为数组下标，从而随机获取到一个颜色值。
3. 在`<barrage>`标签中，设置`color`属性为上一步获取到的随机颜色值。

以下是示例代码：

<template>
  <div>
    <barrage v-for="(item, index) in barrageList" :key="index" :text="item" :color="randomColor"></barrage>
  </div>
</template>

<script>
export default {
  data() {
    return {
      barrageList: ['弹幕1', '弹幕2', '弹幕3', '弹幕4'],
      colors: ['#ff0000', '#00ff00', '#0000ff']
    }
  },
  mounted() {
    setInterval(() => {
      this.barrageList.push('新弹幕')
    }, 1000)
  },
  computed: {
    randomColor() {
      const randomIndex = Math.floor(Math.random() * this.colors.length)
      return this.colors[randomIndex]
    }
  }
}
</script>