Flux：顶级视图不应该是 "dump"（不要从商店获取数据）

Question

也许在 flux 官方网站上我看到了一个视频，导师说了这样的话：

Only top-level React views should know about stores. All not top level views should be dump and receive all information as properties.

问题： 对吗？请大家议论

但是，假设您有一些在多个页面上重复使用的小型 React 视图 Button.react。并假设 Button.react 必须知道一些商店数据。如果我们不直接从 Button.react 获取所有数据，我们会在重用 Button.react 的每个顶级组件处得到重复的代码。 你可以吗？

Answer 1

希望我理解你的问题。

React 的特点之一是它的单向数据流。每个组件都可以被另一个组件使用，就像一个函数可以调用另一个函数一样。就像函数一样，React 组件通常应该能够从传递给它的参数中获取它工作（渲染自身）所需的所有信息。这是props in React. When using Flux, sometimes the React Components, which are typically near the top of the view hierarchy, that actually fetch the data from the stores to pass down thru the application are called Controller-Views.

的功能

每个组件都不会成为 Controller-View，直接从存储中获取自己的状态，这不是强制性规则，但这是有充分理由的通用做法。考虑两个函数：

function renderToggleButton( isSelected ){
  //... render the button
}

对

function renderToggleButton(){
  var isSelected = StateStore.getButtonSelectedState( id );
  //... render the button
}

我想你会同意第二个功能更复杂，更难测试。它必须知道从哪里获得初始条件。它还必须知道如何在应用程序的上下文中识别自己。函数应该不必知道.

这两件事

现在想象一个充满这样功能的应用程序。如果一个功能出现问题，就很难追踪它的输入；在受控条件下对其进行测试。我希望澄清通过应用程序传递数据的指导 props.

Flux：顶级视图不应该是 "dump"（不要从商店获取数据）

Flux: should not-top-level views be "dump" (do not fetch data from stores)

javascript

flux

reactjs