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>
相关推荐
bloxed几秒前
前端文件下载多方式集合
前端·filedownload
余生H6 分钟前
前端Python应用指南(三)Django vs Flask:哪种框架适合构建你的下一个Web应用?
前端·python·django
LUwantAC14 分钟前
CSS(四)display和float
前端·css
cwtlw18 分钟前
CSS学习记录20
前端·css·笔记·学习
界面开发小八哥23 分钟前
「Java EE开发指南」如何用MyEclipse构建一个Web项目?(一)
java·前端·ide·java-ee·myeclipse
谢道韫66630 分钟前
今日总结 2024-12-24
javascript·vue.js·elementui
一朵好运莲32 分钟前
React引入Echart水球图
开发语言·javascript·ecmascript
米奇妙妙wuu37 分钟前
react使用sse流实现chat大模型问答,补充css样式
前端·css·react.js
傻小胖42 分钟前
React 生命周期完整指南
前端·react.js
梦境之冢1 小时前
axios 常见的content-type、responseType有哪些?
前端·javascript·http