Question

我有一个组件 - 实际上是一个表单 - 显示一组项目的可编辑价格。此表单中的每一行也是一个组件，因此存在嵌套关系（父组件和子组件）。

在此表单的底部是一个取消用户对表单所做的任何更改的按钮，这意味着它需要影响所有子组件。理想情况下，我想从“取消”按钮触发一个动作，并让子组件对此作出反应。

我知道这违反了Ember的Data Down / Actions Up方法，但我不确定如何处理这个问题。

有没有办法做到这一点？

Answer 1

遵循数据关闭，操作方法，你必须做这样的事情。

父组件：

App.ParentComponent = Ember.Component.extend({
    isCancelled: false,
    actions: {
        cancel: function() {
            this.set('isCancelled', true);
        }
    }
});

父模板：

{{child-component isCancelled=isCancelled}}
<button {{action 'cancel'}}>Cancel</button>

子组件：

App.ChildComponent = Ember.Component.extend({
    isCancelled: false,
    wasCancelled: function() {
        if (this.get('isCancelled')) {
            // Cancelled logic here
        }
    }.observes('isCancelled')
});

我不确定在按下取消按钮时你想要对子组件发生什么，但是你可以使用计算属性而不是观察者（我认为它更清洁）。

触发Ember.js中嵌套组件中的操作

1 个答案: