import{e as t,o as d,G as e}from"./vendor.e1f99099.js";const a={class:"markdown-body"},r=[e('

Barrage 组件

介绍

用于话语和词组的轮播展示,适用于视频中或其他类似需求中。

安装

import { createApp } from 'vue';\nimport { Barrage } from '@nutui/nutui';\n\nconst app = createApp();\napp.use(Barrage);\n\n

代码演示

基础用法1

Iconname 属性支持传入图标名称或图片链接。

<nut-barrage ref="danmu" :danmu="list"></nut-barrage>\n
  setup() {\n    const inputVal = ref<any>('');\n    const danmu = ref<any>(null);\n    let list = ref(["画美不看", "不明觉厉", "喜大普奔", "男默女泪", "累觉不爱", "爷青结"]); \n    function addDanmu() {\n      danmu.value.add(inputVal.value);\n    }\n    return {\n      inputVal,\n      danmu,\n      list,\n      addDanmu\n    };\n  }\n

API

Props

参数说明类型默认值
danmu弹幕列表数据Array[]
frequency可视区域内每个弹幕出现的时间间隔Number200
speeds每个弹幕的滚动时间Number2000
rows弹幕行数,分几行展示Number1
top弹幕垂直距离Number10
loop是否循环播放Booleantrue

Events

事件名说明回调参数
add添加数据-
',15)],n={setup:e=>(e,n)=>(d(),t("div",a,r))};export{n as default};