javascript - 使用 Vue 2 和 JSX 绑定(bind)自定义事件

Question

我想在根标签上绑定(bind)自定义事件，而不是在 mounted() 中绑定(bind)它。所以我尝试了以下代码:

render (h) {
  return (
    <div on-custom-event={this.handleCustomEvent}></div>
  )
}

但是当我用 Chrome 运行它时，我发现 custom-event 绑定(bind)到 DOM，它不能用 $emit 触发，但是用 VueJS 2 的模板语法很容易做到:

<template>
   <div @custom-event="handleCustomEvent"></div>
</template>

请帮我解决这个问题，谢谢!

Answer 1

派对有点晚了，但是......

要触发事件，您需要执行以下操作:

protected render(h: any) {
    return (
        <a onClick={(e: any) => this.$emit('test')}>
            {this.$slots.default}
        </a>
    );
}

监听事件:

protected render(h: any) {
    return (
        <NavLink onTest={() => alert('clicked')}>
            <i class='fa fa-bars'></i>
        </NavLink>
    );
}