官方React.js tutorial有一个有趣的做法,即将回调作为道具传递给子组件。在他们的示例中,他们有一个名为CommentBox
的父组件和一个名为CommentForm
的子组件。父(CommentBox
)将回调方法handleCommentSubmit
传递给子(CommentForm
)。提交表单时,子组件将触发回调以通知父表单已提交表单。
但是,这个React教程是而不是 Flux architecture上的教程。从我有限的流量角度来看,我的第一直觉是子视图应该调用一个动作,该动作(通过全局调度系统)更新商店。然后,更新的商店将触发任何有意识的组件的更新,包括相关的父组件CommentBox
。
换句话说,父组件不关心,也不想知道它的孩子,CommentForm
正在做什么,或者提交表单的时间。相反,它会在商店更新时重新呈现。这意味着触发商店更新的任何会导致更新CommentBox
(在我看来这是一件好事;如果有多种方式提交评论会怎么样?)< / p>
这让我想到了我的主要问题:Flux架构中是否存在 适合将回调方法传递给子组件的情况,或者这通常是反图案?
注意:Flux + React.js - Callback in actions is good or bad?不是同一个问题 - 我在视图中询问回调,而不是在操作中。
答案 0 :(得分:2)
如果你有一个纯粹的UI组件,就像一个花哨的按钮,在UI中启用回调是有意义的;动作只应用于触发应用程序更改:
<MyFancyButton onClick={this.handleClick}/>
显然,MyFancyButton
没有足够的信息来知道点击应该做什么;它取决于父视图,它使用它来决定要分派的动作。