Javascript Webcomponent自定义元素传递函数onClick

我想使用ReactJS将函数传递给自定义元素

ReactJS组件

import React from 'react';
import './SampleComponent';

export  class Button extends React.Component {

  handleClick = (event) => {
    console.log(event)
  }

  render() {

    return (
      <div>
        <sample-component onclick="handleClick"></sample-component>
      </div>
    )
  }
};

据我所知，当我传递onclick函数时，

handleClick

JS将在自定义元素实现中搜索它（这就是为什么我在控制台中得到一个错误）。那么如何传递函数呢？我尝试了

“this.handle”

，但它也不起作用。

由于您的html应该是这样的

<sample-component onClick={handleClick}></sample-component>

由于您的html应该是这样的

<sample-component onClick={handleClick}></sample-component>