如何使用Web组件触发React点击事件

时间:2019-01-03 10:45:13

标签: web

我已经使用WebComponent渲染了ReactComponent,但是组件click事件没有触发

是否可以触发由WebComponent呈现的ReactComponent事件?

一个简单的React组件

const event = () => {
  console.log('aaaaaa');
}

export const Component = ({message}) => {
  return (
    <button type={'button'} onClick={event}> {message} </button>
  ) 
};

在WebComponent呈现中调用它

export class ConfirmButton extends HTMLElement {
  connectedCallback() {
    const parent = document.createElement('div');
    const message = this.getAttribute('message');
    this.attachShadow({ mode: 'open' }).appendChild(parent);

    ReactDOM.render(<Component message={message} />, parent);
  }
}

假设,单击按钮时应在控制台上显示“ aaaa”。

但是,没有显示结果...

0 个答案:

没有答案