【发布时间】：2021-03-03 03:00:30
【问题描述】：
我有一个使用 tsparticles 库的 vue 组件，我想将它设置为背景，因为它与我的所有其他组件重叠，谁能帮助我如何做到这一点？
【问题讨论】：
标签： css vue.js vue-component vuetify.js
【发布时间】：2021-03-03 03:00:30
【问题描述】：
如果您希望它在 booleanToShow 为 true 时运行但不显示：
<div v-show="booleanToShow"></div>
如果您想将其从 DOM 中移除（并停止运行）
<div v-if="booleanToToggle"></div>
【讨论】：
-
我希望它不显示在前面，而是作为背景动画显示，并将其他组件放在它上面
您可以使用backgroundMode 属性将tsparticles 设置为后台。
您可以在此处查看工作示例：https://codesandbox.io/s/xenodochial-colden-uvs85?file=/src/App.vue
属性backgroundMode 将tsparticles 画布设置为全屏，它是一个具有两个属性的对象：enable 和zIndex。
-
enable（布尔值）：（显然）启用全屏模式 -
zIndex（数字）：将画布元素z-index属性设置为您想要的任何值
backgroundMode 的样本：
{
/* root object */
backgroundMode: {
enable: true,
zIndex: -1
}
/* root object */
}
您也可以设置 background 属性，它是 CSS background 属性的简写。
您可以使用该属性来更改画布背景颜色，例如：
{
/* root object */
background: {
color: "#000"
}
/* root object */
}
如果您设置一个否定的zIndex，您需要在interactivity 对象中使用detectsOn: "window" 以保持鼠标事件正常工作。
【讨论】：