Mithril.js：两个 child 组件是否应该通过其 parent 的控制器相互通信？

Question

我在寻找执行以下操作的正确方法时遇到了困难。我有一个 parent 组件和两个 child 组件（参见下面的简化代码）。我想知道按下按钮时 ChildA 到 'invoke' ChildB 的正确方法。他们应该通过 parent 进行通信，但他们应该通过控制器进行通信吗？在这种情况下，parent 必须将其控制器传递给 children 的控制器。

Parent = {
  view: function () {
    m.component(ChildA);
    m.component(ChildB);
  }
}

ChildA = {
  view: function () {
    m('button')
  }
}

ChildB = {
  view: function () {
  }
}

Answer 1

我猜当你按下ChildA的按钮时，一些模型状态会被更新？然后，如果两个 child 共享相同的模型，则 Mithril 在每个事件后所做的重绘将自动更新 ChildB。

我的建议是将模型传递给 child objects 并让 ChildA 也成为按钮的控制器。为什么不是 parent？ Parents 通常应该处理适用于多个 child 视图（或自身）的命令，并且单击按钮似乎 simple/coupled 足以让 ChildA 自行管理。但这当然取决于系统的实际复杂性。总是用一个简单的例子来解决问题，它没有描述现实。 :)

这是我的意思的一个例子：http://jsbin.com/sipahe/edit?js,output

（对 Coffeescript 感到抱歉，但它很简短并且很好地传达了意思。）

Answer 2

这实际上只是您喜欢的普通 javascript 风格的问题。想想 JS objects 之间的通信以及你将如何处理它。

一般来说，秘银开发者会在Parent/Child通信和Pub/Sub之间做出选择。对于 Parent/Children，控制器通常是开发人员放置逻辑的地方。 m.component 接受多个参数，您可以在其中将引用 (data/state/logic) 传递给 child 组件。 See the docs。无需将 Parent 控制器传递给 children。

但是，我更喜欢创建一个位于任何组件之外的 view-model。这是我保存视图状态（即表单数据）和视图逻辑（即事件、UI 相关回调以及组件之间的共享状态）的地方。这样，当我不可避免地 change/add 个组件时，我将不必在每个组件中重新设计控制器逻辑。

Mithril 的作者 Leo Horie，wrote an article 在其中解释了 Parent 和 One Child 之间的通信，但这可以毫不费力地应用于多个 child仁.

Pub/Sub 是一个常见的 JS 习语。 Mithril wiki 列出了一些处理此问题的社区贡献。转到 the wiki，打开标题为 "All Topics" 的页面，然后对 "pub" 进行正常的页面搜索。您会在那里发现一些选项。根据您应用的复杂程度，您的下一步可能是通过 google.

搜索 Pub/Sub 库

Mithril.js：两个 child 组件是否应该通过其 parent 的控制器相互通信？

Mithril.js: Should two child components talk to each other through their parent's controller?

mithril.js