Ember 将多个操作生成到组件中

Question

我有一个 checkout-form 组件，它有一些操作，例如 next、previous、submitForm 和 selectDate。目前我只能 yield selectDate 像这样的操作：

{{!-- checkout-form.js --}}
<div class='checkout-form'>
  {{yield (action 'selectDate')}}
</div>

我希望能够像这样使用我的 checkout-form 组件：

{{!-- order.hbs --}}
{{#checkout-form as |submitForm, selectDate|}} 
  {{checkout-field placeholder="Full Name" value=model.order.name}}
  {{!-- another field component that uses selectDate --}}
  {{checkout-form-actions action=submitForm}}
{{/checkout-form}}

我将如何着手生成要在我的 checkout-form.hbs 中使用的多个操作？

Answer 1

选项 1. 您可以像下面这样传递许多参数

{{yield (action 'selectDate') (action 'submitForm')}}

阅读 - https://guides.emberjs.com/v2.14.0/components/block-params/

和

{{!-- order.hbs --}}
{{#checkout-form as |selectDate, submitForm|}} 
  {{checkout-form-actions action=selectDate}}
  {{checkout-form-actions action=submitForm}}
{{/checkout-form}}

选项2.您也可以使用hash helper,

{{yield (hash 
        selectDate=(action 'selectDate')
        submitForm=(action 'submitForm')) }}

和

{{#checkout-form as |options|}}   
  {{checkout-form-actions action=options.submitForm}}
{{/checkout-form}}

Ember 将多个操作生成到组件中

Ember yield multiple actions into component

javascript

ember.js