javascript - React.js + Flux——在 View 中将回调作为 Prop 传递

Question

官方React.js tutorial有一个有趣的做法，将回调作为 prop 传递给子组件。在他们的示例中，他们有一个名为 CommentBox 的父组件和一个名为 CommentForm 的子组件。父项 (CommentBox) 将回调方法 handleCommentSubmit 传递给子项 (CommentForm)。提交表单时，子组件触发回调通知父表单已提交。

但是，本 React 教程不是关于 Flux architecture 的教程.从我有限的通量 Angular 来看，我的第一直觉是 subview 应该调用一个 Action ，该 Action (通过全局调度系统)更新商店。更新后的存储随后会触发任何需要知道的组件的更新，包括相关的父组件 CommentBox。

换句话说，父组件不会关心，也不想知道它的子组件 CommentForm 在做什么，或者何时提交表单。相反，它会在商店更新时重新呈现。这意味着触发商店更新的任何都会导致CommentBox更新(我认为这是一件好事；如果有多种提交评论的方式会怎样？)

这让我想到了我的主要问题:在 Flux 架构中是否存在过适合将回调方法传递给子组件的情况，或者这通常是一种反-模式？

---

备注:Flux + React.js - Callback in actions is good or bad?不是同一个问题——我问的是 View 中的回调，而不是操作中的回调。

Answer 1

如果你有一个纯 UI 组件，比如一个花哨的按钮，那么在 UI 中启用回调是有意义的；操作应仅用于触发应用程序更改:

<MyFancyButton onClick={this.handleClick}/>

显然，MyFancyButton 没有足够的信息来了解点击应该做什么；由父 View 使用它来决定调度哪些操作。