不从组件到路由冒泡的操作(Ember 1.13)

Question

我有一个项目 - row.js组件为CRUD中的每一行和一个触发"addNewItem"的按钮,因为我需要做一些额外的处理.

好吧,这个动作永远不会冒泡到路线上,所以我相信我做错了什么.恩伯指南会告诉我完全正在做的事情,所以我完全迷失在这里.我错过了什么吗？

码:

我的模板是这样的:

// my-template.hbs
{{#each model as |item|}}
    {{#item-row
         id = item.id
         text = item.text
    }}
        {{item.title}}
    {{/item-row}}
{{/each}}

在该组件的模板中:

// item-row.hbs
// a couple of HTML here
<button {{action "addNewItem"}}> </button>

当然,我有一个组件

// item-row.js
export default Ember.Component.extend({

actions: {
        addNewItem: function(){
          this.sendAction('addNewItem');
          // already tried this.sendAction() without the parameter..
          return true;
    }
   }

});

最后,我的路线:

// item.js
export default Ember.Route.extend({

    actions: {

        addNewItem: function(){
          alert('reached the route!!!!!');
          // this is never printed =/
        }

    }

});

我感谢任何帮助:)

Answer 1

sendAction在这种情况下,组件中的方法将在组件上查找与传递该方法相同名称的属性'addNewItem'.因此,为了使您的示例正常工作,您需要传递addNewItem = 'addNewItem'给item-row组件,以便组件知道要在路由上触发的操作.

你可以看看这个JSBin,看看我在说什么.它使用全局变量而不是ES6模块,但希望应该足够简单,以遵循:)

此部分的Ember指南也可能对您有所帮助.