javascript - 在 stenciljs 中的自定义 Web 组件中传递 @Prop() 函数

Question

如何将 @Prop() 作为函数传递给 Stencil.js 中的组件以切换事件？

@Prop() myFunction() {
         console.log("Hello World!")
         }

并将其放入

<my-component onClick={myFunction()}></my-component>

Answer 1

这不是在您的 Web 组件中处理事件的正确方法。为了处理 Web 组件上的 onClick 事件，您必须通过使用 @Listen 装饰器对其进行装饰，从而在您的组件中实现点击监听器。

https://stenciljs.com/docs/events事件 - 模板

@Listen('click')
onClickHandler(event) {
// Do something
}

如果您希望您的用户编写代码来确定点击您的组件时应该发生什么，您需要从您的组件发出点击事件并且用户应该为此实现一个监听器

https://stenciljs.com/docs/events事件 - 模板