Expand Minimize

Don't specify React event handlers as a string

When specifying event handlers in React, always specify them using a function and not a string

CheckId RCT010109
TypeName StringEventHandlerRule
Severity Error
Type React component

When specifying event handlers in React, always specify them using a function and not a string.

Bad practice

export class Feedback extends React.Component {
    render() {
        return <button onClick="alert('Received');">Submit</button>;
    }
}


Good practice
export class Feedback extends React.Component {
    submitFeedback() {
        alert('Received');
    }

    render() {
        return <button onClick={this.submitFeedback}>Submit</button>;
    }
}

Disclaimer: The views and opinions expressed in this documentation and in SPCAF do not necessarily reflect the opinions and recommendations of Microsoft or any member of Microsoft. SPCAF and RENCORE are registered trademarks of Rencore. All other trademarks, service marks, collective marks, copyrights, registered names, and marks used or cited by this documentation are the property of their respective owners.