English | 简体中文
把蔚蓝档案风格的粒子效果从 DoomVoss/BASpark 移植到 Vue 3
import { createApp } from 'vue';
import App from './App.vue';
import BASpark from 'vue-ba-spark';
const app = createApp(App);
app.component('BASpark', BASpark);
app.mount('#app');<script setup>
import BASpark from 'vue-ba-spark';
</script>
<template>
<BASpark />
</template>你可以像 canvas 元素一样传参给 BASpark 组件,就像这样:
<BASpark title="VUE-BASPARK" style="border: 1px solid deepskyblue;" />你也可以传递 opts 属性给 BASpark 组件来自定义效果。
| 选项 | 类型 | 默认值 | 描述 |
|---|---|---|---|
color |
string |
45,175,255 |
效果(点击特效和鼠标轨迹)的主要颜色,格式为r,g,b |
scale |
number |
1 |
效果的缩放比例 |
opacity |
number |
1 |
效果的透明度 |
speed |
number |
1 |
动画速度 |
maxTrail |
number |
16 |
最大轨迹长度 |
alwaysTrail |
boolean |
false |
在鼠标未按下时也显示轨迹 |
showFPS |
boolean |
false |
显示帧率 |