Golang React JS Technology Blog

onClick Event binding and get event name in ReactJs

Create React App

Type the following command to create a new react app:

npx create-react-app demo

Now, go to the project folder:

cd demo

Now, update default App.js with below code snippet

src\App.js

import React, { Component } from 'react';
 
class App extends Component {
  constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }
 
  handleClick = (event) => {
      alert(event.type);
  }
 
  render() {
    return (
      <div>
        <div className="text-center">
          <button className="btn btn-secondary" onClick={this.handleClick}>
            Click Me
          </button>
        </div>
      </div>
    );
  }
}
 
export default App;
Most Helpful This Week
React Props How to use React-Bootstrap component? State and Props in React React JSX Check which Radio button is Selected or Clicked How to perform computation inside expression using ternary operator? Display JSON Data in React JS What is JSX? How to use arrow function in React stateless components? How to create Functional Component?