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>
相关推荐
百锦再9 分钟前
复杂查询中基于代价的连接条件下推实践与思考
前端
广州华水科技10 分钟前
如何实现高精度的单北斗GNSS位移监测系统安装?
前端
肉肉不吃 肉21 分钟前
Vue Router 路由模式
前端·javascript·vue.js
北寻北爱21 分钟前
Vue-Router
前端·javascript·vue.js
肉肉不吃 肉27 分钟前
什么是闭包
前端·javascript
窝子面31 分钟前
十六、按钮组件
前端
天天向上102432 分钟前
vue 页面内实现el-table和div自动滚动
前端·javascript·vue.js
前端老石人39 分钟前
HTML文档元素与元数据详解
前端·html
wing9843 分钟前
用 AI 实现图片懒加载,这也太简单了!
前端·vue.js·图片资源
sigernet1 小时前
Claude Code 不再推荐 npm 安装:官方改为 Native Installer
前端·npm·node.js