Javascript 这种组件通信方法是余烬反模式吗?

Javascript 这种组件通信方法是余烬反模式吗?,javascript,ember.js,single-page-application,Javascript,Ember.js,Single Page Application,以html和JS为例: {{main view} {{some action tagName='button'}执行此操作 {{/main view} //组件/main-view.js Ember.Component.extend{ 主视图:是的, doSomething:函数{alert'doing something'} } //组件/some-action.js Ember.Component.extend{ 主视图:空, configureMainView:函数{ this.set'm

以html和JS为例:

{{main view} {{some action tagName='button'}执行此操作 {{/main view} //组件/main-view.js Ember.Component.extend{ 主视图:是的, doSomething:函数{alert'doing something'} } //组件/some-action.js Ember.Component.extend{ 主视图:空, configureMainView:函数{ this.set'mainView',this.nearestWithProperty'mainView'; }.在“didInsertElement”上, 单击:函数{ 这个。获取“主视图”。doSomething; } } 这个想法是为了让后代组件能够与祖先的接口交互。一个用例示例可能是您希望各个页面内容容器能够配置页面上是否有汉堡菜单,如{{page content show menu='false'}}。通过这种方式,您可以简单地在顶层定义菜单,并让孩子们根据其内容的需要进行配置

我来自angular世界,但在Ember中处理这类事情似乎更可取的方法是绑定到控制器属性或在动作冒泡的任何适当级别处理routes/controller动作中的动作。我不禁感到,在许多情况下,控制器和路由不必担心UI配置,因此相关的UI组件应该能够简单地相互通信,而不必担心控制器


我在ember cli插件中实际看到的另一种模式是子组件查找并向特定父组件注册它们自己。然后,父对象将调用子对象的接口,或者按照它们认为合适的方式操作它们。基本上与上面的概念相同,正好相反。

通信的“余烬方式”是从父模板向组件添加操作处理程序:

//组件/main-view.js

{{#main-view}}
  <!-- page html - header, content, etc. -->

  {{some-action tagName='button' action="doSomething"}} Do it

  <!-- more page html -->

{{/main-view}}
如果你不想在父母身上处理它,就让它冒泡吧。
它在指南中介绍了这一点:

因此,当某个操作与主视图不在同一上下文/范围内,因此无法直接向其发送操作时,您必须在更高的路由上定义一个操作,然后从主视图中观察控制器属性,以了解何时执行了该操作?您能给我一个示例,说明您需要两个组件,它们不在同一层次结构中,在没有某种第三方对象的情况下进行交互吗?
Ember.Component.extend({
  click: function() {
    this.sendAction();
  }
});