Skip to content

Methods

为满足更多场景 danmaku-vue 提供了这些方法:

列表

方法名说明参数
play开始/继续播放-
pause暂停弹幕播放-
clear停止播放并清空弹幕-
show弹幕显示-
hide弹幕隐藏-
reset重置配置(也可在改变播放区域大小后调用)-
resize容器尺寸改变时重新计算滚动距离(需手动调用)-
push发送弹幕(插入到弹幕列表末尾,排队显示)danmu 数据,可以是字符串或对象
add发送弹幕(插入到当前播放位置,实时显示)danmu 数据,可以是字符串或对象
insert绘制弹幕(实时插入,不进行数据绑定)danmu 数据,可以是字符串或对象
getPlayState获得当前播放状态-
getInsertList获取使用 insert 方法插入的弹幕列表danmu[]

使用时请注意以下几点:

  1. pushadd 的返回值为插入后的下标,可通过判断下标的方式对当前插入弹幕进行样式定制;
  2. insertpush/add 的区别在于,insert 不进行数据绑定,而是直接插入 DOM,适用于直播等场景;
  3. 推荐使用 insert 方式单条插入弹幕,因为 add 会进行数据绑定;

Usage

可通过以下方式调用:

vue
<script setup>
import Danmaku from 'danmaku-vue'
const danmakuRef = ref<InstanceType<typeof Danmaku>>(null) 
danmakuRef.value.play() 
</script>

<template>
<Danmaku ref="danmakuRef"></Danmaku>
</template>

具体用法不在赘述,详情可参考demo

Copyright © 2023-present dshuais. All rights reserved.