Question

我正在构建应用程序的UI，我正在探索更新UI而无需使用States。以下断言是否粗略正确？

'我们不需要状态，因为当状态内的某些内容发生变化时，它所做的就是在组件上自动调用render方法。我们可以通过在相关组件上调用render方法来实现相同的实现。

我们仍然可以实现React的所有相同优势（虚拟DOM，渲染，绘画优化等）'

Answer 1

技术上正确，您无需使用React的内部组件状态来构建React应用程序。当然，数据需要在某处，所以你需要一种机制，当数据发生变化时，它可以将所有数据传递到顶层组件（它将渗入所有其他组件）

这是flux（和许多其他旨在提供React状态外存储的模式）背后的基本思想。您有一个或多个商店，商店会在数据更改时提供更改事件。然后，数据通过道具传递到应用程序。

function render(data) {
  ReactDOM.render(
    <Application data={data} />,
    containerNode
  )
}

myDataStore.on('change', render);

然而，实际上，由于JavaScript的工作原理，很难做到这一点。像上面这样的代码会使React每次myDataStore更改时重新呈现整个组件树，并且没有良好的shouldComponentUpdate挂钩，这可能是性能问题。使用不可变值有助于更轻松地实现良好的shouldComponentUpdate方法。

您通常会在使用React数据存储之外的更大的React应用程序中看到以下内容的组合：

一个或多个"container" components负责从商店获取数据并将其传递给子女。有时将容器放在其他的位置而不是组件树的顶部是有意义的（例如，您可能在一个应用程序中有多个容器）
可重复使用/＆＃34;表象＆＃34;不挂钩到数据存储中但提供其他一些好处的组件（例如黑盒子样式或交互式窗口小部件）。在这些情况下，将任何非特定于应用程序的状态保留在组件本身中通常是有意义的。

使用没有状态的React

1 个答案: