【问题标题】:Actions not bubbling up from Component to Route (Ember 1.13) [duplicate]操作不会从组件冒泡到路由(Ember 1.13)[重复]
【发布时间】:2015-08-10 00:16:56
【问题描述】:

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

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

代码:

我的模板是这样的:

// 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 =/
        }

    }

});

感谢您的帮助:)

【问题讨论】:

  • 这让我每次都兴奋!

标签: javascript ember.js


【解决方案1】:

组件中的sendAction 方法将在组件上查找与您传递该方法同名的属性,在本例中为'addNewItem'。因此,要使您的示例正常工作,您需要将 addNewItem = 'addNewItem' 传递给您的 item-row 组件,以便该组件知道要在路由上触发什么操作。

您可以查看this JSBin 以了解我所说的示例。它使用全局变量而不是 ES6 模块,但希望它应该足够简单以便遵循 :)

This section 的 Ember 指南也可能对阅读有所帮助。

【讨论】:

  • 支持添加示例
  • 抱歉,忘记设置为答案了。完成:) 谢谢!
  • 您应该在答案中发布代码(连同 ember 版本),以防链接失效。我现在无法访问该链接。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2013-11-15
  • 2016-03-24
  • 2014-08-26
  • 2014-07-26
  • 2017-05-02
  • 1970-01-01
  • 2016-01-03
相关资源
最近更新 更多