首页 > 解决方案 > 有没有办法将 Particlesbg 限制为仅组件,使其不覆盖整个 App.vue 背景

问题描述

如何将 Particles-bg 限制为仅一个组件,使其不覆盖整个 App.vue 背景,而是我希望动画所在的组件?我安装了这个库,并通过 main.js 将它全局导入到我的项目中。我通过 Main.vue 组件渲染它。问题是动画也流入了其他组件,我只希望它只保留在 Main.vue 之一中。

这是显示它是如何从 Main.vue 呈现的代码。

 <template>
    <div class="intro-container">
       <particles-bg  type="custom" :bg='true' :config='config' />         
    </div>
 </template>

<script>
import { ParticlesBg } from "particles-bg-vue";

export default {
    name: 'Main',
    components:{ 
        ParticlesBg
    },
    data(){
        return{
            config:{
                num: [3, 20],
                rps: 1,
                life: [2, 2],
                v: [5, 10],
                tha: [-50, 40],
                rotate: [0, 20],
                alpha: [0.1, 0.2],
                scale: [1, 1],
                position: "center",
                color: ["#808080", "#808080"],
                cross: "dead", 
                g: 5, 
                random: 2,
                force:[2, -1],
}
}

标签: javascriptvue.jsanimationcomponents

解决方案


推荐阅读