如何向 EmberJs 中的组件元素添加“action”？

Question

我正在用 li 元素包装我的组件。没关系。但是我也在尝试将操作添加到 wrapped 元素。但是出现错误。将 action 添加到包装元素的正确方法是什么？

有人帮帮我吗？

我的组件：

<ul>
        {{#each cardList as |card index |}}
                {{
                    cs2i-cardcomponent 
                    card=card
                    index=index
                    enableNext='enableNext'
                    tagName="li"
                    {{action "selectCard card index"  }}//not works. trying to pass card and index to selected card in actions object in componet.js.
                }}
        {{/each}}
    </ul>

我的组件 js :

import Ember from 'ember';

export default Ember.Component.extend({
    tagName:"",
    firstBalanceType : '',
    firstBalanceAmount : '',
    lastBalanceType : '',
    lastBalanceAmount : '',
    isSelected : false,


    actions : {
        selectCard : function(card,index) {
            this.set('selectedIndex', index );
            this.toggleProperty('isSelected');
            this.sendAction('enableNext', card);
        }
    }
});

Answer 1

您在这里发送 selectCard 关闭操作，它包装了在当前上下文中定义的 selectCard 函数。

{{cs2i-cardcomponent card=card index=index enableNext='enableNext' tagName="li" selectCard=(action "selectCard" card index)}}

我鼓励您将所需的数据作为参数发送到组件，而不是上面的方法，您可以从那里发送参数中的数据。

关注ember guides

如何向 EmberJs 中的组件元素添加“action”？

How to add `action` to component element in EmberJs?

javascript

ember.js