vue3 setup语法糖 vue-particle-effect-buttons动画使用

使用方法：
particle-effect.vue 文件为核心文件，引入此文件即可
文件地址：https://gitee.com/wang_fan_w/particle-effects

此处已将vue-particle-effect-buttons动画封装成了一个组件，使用的时候将组件引入，不需要任何依赖，即可使用。

<template>

     <ParticleEffect
     :hidden="effectHidden"
     direction="left"
     particle-type="rectangle"
     particle-style="fill"
     particle-color="#409eff"
     :duration="500"
     easing="easeInOutCubic"
     :canvas-padding="300"
     :size="6"
     :speed="4"
     :particles-amount-coefficient="8"
     :oscillation-coefficient="20"
     @click="show"
     >
     
     这里放入内容
     
     </ParticleEffect>
</template>


<script setup>
import { ref } from 'vue';
// 引入组件
import ParticleEffect from '../components/particle-effect.vue'
// 动画是否开启 false关闭，true开启
const effectHidden = ref(false)

const show = () =>{
 effectHidden.value =！ effectHidden.value
}

</script>

内容仅供参考，了解更多请看说明文档

文档：
https://github.com/dreambo8563/vue-particle-effect-buttons