很无聊，用Vue实现的粒子效果背景，类似星座图的指南

图上的点和线都是由vue-particles生成的，不仅自己移动，还会和用户鼠标事件产生交互。教程：npminstallvue-particles--save-dev将以下代码添加到main.js：importVueParticlesfrom'vue-particles'Vue.use(VueParticles)A??pp.vue文件-完整示例：/*如果要制作背景图，可以直接在label中添加背景图类*/属性：颜色：字符串类型。默认“#dedede”。颗粒颜色。particleOpacity：数字类型。默认值为0.7。粒子透明度。particlesNumber：数字类型。默认值为80。粒子数。shapeType：字符串类型。默认为“圆”。可用的粒子外观类型有：“圆形”、“边缘”、“三角形”、“多边形”、“星形”。particleSize：数字类型。默认值为80。单个粒子大小。linesColor：字符串类型。默认“#dedede”。线条颜色。linesWidth：数字类型。默认值为1.线宽。lineLinked：布尔类型。默认为真。电缆是否可用。lineOpacity：数字类型。默认值为0.4。线条透明度。linesDistance：数字类型。默认值为150。行距。moveSpeed：数字类型。默认值3。粒子速度。hoverEffect：布尔型。默认为真。是否有悬停效果。hoverMode：字符串类型。默认为真。可用的悬停模式有：“抓取”、“击退”、“泡泡”。点击效果：布尔型。默认为真。是否有点击效果。clickMode：字符串类型。默认为真。可用的点击模式有：“推”、“移除”、“排斥”、“泡泡”。让我告诉你一个陷阱：这有一个定位问题。vue-particles标签始终处于最高级别，您不能在标签内添加任何子标签。无论如何，我是这样做的：给vue-particlesa:position:absolute;z-index:0;然后放上你要的内容，比如：div，来一个section：position:relative;z-index:9999;当然，在包含这两个标签的parentset上，我使用的是Position:flex;然后居中。好吧，就是这样。