在反应中使用 dispatchEvent 时不会触发复选框更改事件

Question

I have a Checkbox component with an onChange event handler. I want to trigger the onChange event in another elements click handler. I am creating a custom event and dispatch the event in the click handler. I could see this works fine in a native way whereas I could not achieve the same in react.

Use of Checkbox component

<Checkbox onChange={this.handleChange} />

I have created an example, please find the URL https://stackblitz.com/edit/react-dvrssp?file=Checkbox.js

Your help is highly appreciated.

Answer 1

Couple of things. You are not using the correct prop in your CheckBox component. You are accessing this.props.onChange , it should be this.props.onCLick instead.

Also you need to make a call to the function on the radio button onChange .

I have edited the code. You can check it here. https://stackblitz.com/edit/react-mwqfxv?file=Checkbox.js