ember.js 如何在Ember Octane中将“操作”从模板传递到它的孙子组件

mbjcgjjk  于 2022-11-05  发布在  其他
关注(0)|答案(1)|浏览(197)

我试图将一个“动作”从控制器传递到当前模板的孙组件。但是由于某种原因失败了。有人能告诉我我在这里遗漏了什么吗?

MainTemplate's Router Controller

export default class MainTemplateController extends Controller {

  field = "userId";

  @action
  save () {
    //save data
  }

}

MainTemplate.hbs

<ChildComponent @field={{this.field}} @save={{this.save}} /> 

ChildComponent.hbs 

<GrandChildComponent @field={{this.field}} @save={{this.save}} />

GrandChildComponent.hbs

<button @onClick={{action "doSomething" (readonly @field)}}>Save</button>

export default class GrandChildComponent extends Component {    
    @action
    doSomething(fieldName) {
        console.log(fieldName); // logs as "userId"
        console.log(this.args.save) // undefined
    }    
}
gstyhher

gstyhher1#

您的程式码看起来没有问题。您的ChildComponent.hbs档案中有一个小的@参数问题。
由于您是通过ChildComponent将参数从MainTemplatesavefield)传递到GrandChildComponent,因此GrandChildComponent调用应该如下所示:

<!-- ChildComponent.hbs  -->

<GrandChildComponent @field={{@field}} @save={{@save}} />

因为这两个属性是ChildComponent组件的参数,它不拥有它们。希望这能解决你的问题,这份备忘单帮助我更好地理解辛烷:)

相关问题