React App没有状态和道具

0 javascript frontend reactjs

我想知道它是否与React原则完全一致.我创建了一个没有state和prop的React应用程序.我只在componentDidMount中放置了纯javascript,例如

componentDidMount(){
  const first = document.getElementById('first');
  const second = document.getElementById('second');
  function funk(){
     console.log(first.innerHTML);
     second.innerHTML = "Arrr";
  }
  funk();
}
Run Code Online (Sandbox Code Playgroud)

当然这只是一个例子,我的应用程序要复杂得多.

Sag*_*b.g 5

从技术上讲,你可以(你可能已经知道).
你应该这样做吗?一个大而发光的NO!.

通过这种DOM直接定位的方法,您可以绕过并错过通过对帐和差异算法做出反应所带来的大部分善意.

如果你真的(真的)需要定位DOM,你可以使用react的ref API.
你可以在他们的文档中看到它应该谨慎使用:

不要过度使用Refs
你的第一个倾向可能是使用refs在你的应用程序中"让事情发生".如果是这种情况,请花一点时间,更关键地考虑组件层次结构中应该拥有状态的位置.通常,很明显,"拥有"该状态的适当位置在层次结构中处于更高级别.有关此示例,请参阅"提升状态向上"指南.