【问题标题】:how can i use particles.js with react我如何将particle.js 与react 一起使用
【发布时间】:2019-03-24 22:14:32
【问题描述】:

当我使用 particles.js 时,我需要将id="particles-js" 放在我的 index.html 的 div 上。但我已经有一个 id 属性 (id="root"),我在其中呈现我的 App.js。在 index.js 中,在 id="root" 中渲染 App,我将 document.getElementsById('root')) 更改为 document.getElementsByClassName('root')),但它不起作用。我该怎么做才能让它发挥作用?

在 index.html 中

<div id="particles-js" class="root"></div>

在 App.js 中:

ReactDOM.render(<App />, 
  document.getElementsByClassName('root'));
serviceWorker.unregister();

(我一直在导入工作所需的所有文件……如果我将 id="particles-js" 放在另一个 div 中,它可以工作,但我需要将它与 "root" 一起使用来渲染我的应用程序。)

【问题讨论】:

  • 你不能把粒子 div 放在根 div 里面吗?
  • 使用两个&lt;div&gt; 元素。 &lt;body&gt;&lt;div id="root"&gt;&lt;/div&gt; &lt;div id="particles-js"&gt;&lt;/div&gt; &lt;/body&gt;
  • @Colin@Dan, tnks :)
  • 你可以使用 Particle.js,但我会使用 react-particles-js。这是一个更易于在 React 中使用的particles.js 版本。你可以找到here的用法演示。

标签: javascript html reactjs


【解决方案1】:

document.getElementsByClassName('root') 将返回一个数组。 你可以试试:document.getElementsByClassName('root')[0]。 但你必须保证只有一个名为 root 的 className。

【讨论】:

  • 我与 &lt;div id="root"&gt;&lt;/div&gt; &lt;div style="position:absolute; height:100vh; top:0; width: 100vw; overflow: auto; z-index: 1" id="particles-js"&gt;&lt;/div&gt; 合作过,tnks 伙计们为您提供帮助 :)
猜你喜欢
  • 2017-09-08
  • 2018-12-30
  • 2016-09-30
  • 1970-01-01
  • 1970-01-01
  • 2019-08-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多