没有显示弹幕

[sazima]

页面上没显示弹幕， 控制台没有打印 error , 代码是不是有问题。

<template>
    <div style="margin-top: 150px; border: 1px solid">
        <barrage
                ref="barrage"
                class="barrage"
                :barrage-list="barrageList"
                :speed="4"
                :loop="true"
                :channels="4"
        />
        <button @click="addText">add</button>
    </div>

</template>

<script>
  import Barrage from 'vue-barrage'

  export default {
    name: "test",
    components: {Barrage},
    data() {
      return {
        barrageList: [{
          content: '试数据测试数测试数据数测试数据',
          color: 'red'
        }, {
          content: '试数据测试数测试数据数测试数据',
          color: 'red'
        }]
      }
    },
    methods: {
      addText() {
        this.$refs.barrage.add({
          content: '增加一条新的弹幕增加一条新的弹幕',
          color: 'red'
        })
      }
    }
  }
</script>