为什么 particles.js 高度没有扩展？

Question

我想用particles.js作为我的项目背景。我的身高有问题。它不会在设备网络中扩展高度。实际上 height 属性不起作用。请帮我解决一下这个。

代码如下：

https://codesandbox.io/s/4zv0329nn0

particle.js组件。

import React from "react";
import Particles from "react-particles-js";

export default () => (
  <div
    style={{
      width: "100%",
      height: "100%",
      backgroundColor: "blue"
    }}
  >
    <Particles
      params={{
        particles: {
          number: {
            value: 50
          },
          size: {
            value: 3
          }
        },
        interactivity: {
          events: {
            onhover: {
              enable: true,
              mode: "repulse"
            }
          }
        }
      }}
    />
  </div>
);

应用组件。

const App = () => {
  return (
    <div
      style={{
        width: "100%",
        height: "100%",
        margin: "0",
        padding: "0"
      }}
    >
      <ParticleComponent />
      <div
        style={{
          position: "absolute",
          top: 0,
          left: 0,
          width: "100%",
          height: "100%"
        }}
      >
        <h1>test</h1>
      </div>
    </div>
  );
}

Answer 1

将 height={window.outerHeight} prop 添加到 ParticleComponent。

解决方法在这里

为什么 particles.js 高度没有扩展？

Why particles.js height not expanding?

html

javascript

css

reactjs

particles.js