vue 实现粒子特效(vue-particles)

vue 实现粒子特效(vue-particles)

shell 复制代码
npm install vue-particles --save
  • main.js引入
js 复制代码
import VueParticles from 'vue-particles'
Vue.use(VueParticles)
  • 登录页面使用 login.vue
html 复制代码
<template>
  <div class="box">
    <vue-particles
        color="#409EFF"
        :particleOpacity="0.7"
        :particlesNumber="80"
        shapeType="circle"
        :particleSize="4"
        linesColor="#409EFF"
        :linesWidth="1"
        :lineLinked="true"
        :lineOpacity="0.4"
        :linesDistance="150"
        :moveSpeed="3"
        :hoverEffect="true"
        hoverMode="grab"
        :clickEffect="true"
        clickMode="push"
        class="lizi"
      >   </vue-particles>
  </div>
</template>
相关推荐
文心快码BaiduComate2 分钟前
冰城码力全开,共赴AI Coding英雄之旅!CEDxCNCC百度文心快码Meetup圆满落幕!
前端·后端·程序员
inx1773 分钟前
HTML 敲击乐 PART--2
javascript·css
社恐的下水道蟑螂7 分钟前
用CSS3拍一部《星球大战》片头?前端导演的"原力"修炼指南
前端·javascript
子非鱼37311 分钟前
git 常用命令行
前端
Tzarevich14 分钟前
CSS3星球大战:前端代码界的视觉导演艺术
前端·css
BBB努力学习程序设计14 分钟前
CSS复合选择器
前端·html
Juzisuan22 分钟前
深入解析 forEach 与 for...of 在循环体中执行 await 时的区别
javascript
西洼工作室34 分钟前
Strapi快速入门:从安装到API开发
前端·后端
光影少年1 小时前
前端线上出现白屏如何排查问题所在,利用第三方的工具都有哪些
前端·学习·web安全·前端框架
濑户川1 小时前
Vue3 计算属性与监听器:computed、watch、watchEffect 用法解析
前端·javascript·vue.js