Skip to content

Spoke Right

Education for everyone

https://spokeright.com
Primary Menu
  • Home
  • Our Services
    • Translation
    • Interpretation
    • Transcription
    • Voice-Over
    • Proofreading
    • Content writing
  • Free Education
    • Learn Android Studio
    • Learn Python
    • Learn MongoDB
    • Learn MySql
    • Learn React
    • Montessori Education
  • Spoke Right News
  • Earn Online
  • Classic Games by Spoke Right
    • TicTac
    • Checkers
    • Foosball
    • Billiards
    • Master Chess
    • Logic Game
  • Contact Us
Download Now
  • Home
  • Learn React
  • What is event in React
  • Learn React

What is event in React

Spoke Right December 13, 2022 1 min read

Event in React

An action triggered as a result of the user action or system-generated event is termed as an event. The React event handling system, also known as Synthetic Events is a cross-browser wrapper of the browser’s native event and is much like handling events on DOM elements but have some syntactic differences.

  • The events in ReactJS use naming as camelCase instead of lowercase.
  • A function in ReactJS is passed as the event handler with the use of JSX, instead of passing it as a string.
  • To prevent the default behaviour, the preventDefault event must be called explicitly in ReactJS instead of returning false.

Example:

import React, { Component } from 'react';  
class App extends React.Component {  
constructor(props) {  
super(props);  
this.state = {  
StudName: ''  
};  
}  
changeText(event) {  
this.setState({  
StudName: event.target.value  
});  
}  
render() {  
return (  
<div>  
<h2>Event</h2>  
<label htmlFor="name">Student name: </label>  
<input type="text" id="StudName" onChange={this.changeText.bind(this)}/>  
<h4>Entered name: { this.state.StudName }</h4>  
</div>  
);  
}  
}  
export default App;

Continue Reading

Previous: What is Difference Between Controlled And Uncontrolled
Next: What is conditional rendering in Reactjs

Related Stories

Which is Difference Between AngularJS And ReactJS
1 min read
  • Learn React

Which is Difference Between AngularJS And ReactJS

December 16, 2022
What is higher-order component in Reactjs
2 min read
  • Learn React

What is higher-order component in Reactjs

December 16, 2022
How do I create a table in ReactJS
2 min read
  • Learn React

How do I create a table in ReactJS

December 16, 2022

This AD Will support Us

Support Us

Coding Ustad LTD Support
Coding Ustad LTD Support

Coding Ustad LTD

Coding Ustad LTD
Coding Ustad LTD

Recent Posts

  • How to Install Node.js and npm on CentOS 7
  • How to Install Node.js and npm on CentOS 7
  • How to Install CentOS Web Panel (CWP) on CentOS 7
  • The Power of Marketing in Real Estate: A Guide to Boost Your Business
  • Vehicle Verification in Pakistan

Get free Hosting

Hostens.com - A home for your website

You may have missed

How to Install Node.js and npm on CentOS 7
4 min read
  • Coding Ustad LTD
  • Education for Everyone

How to Install Node.js and npm on CentOS 7

May 3, 2023
How to Install Node.js and npm on CentOS 7
4 min read
  • Coding Ustad LTD
  • Education for Everyone

How to Install Node.js and npm on CentOS 7

May 2, 2023
How to Install CentOS Web Panel (CWP) on CentOS 7
3 min read
  • Coding Ustad LTD
  • Education for Everyone

How to Install CentOS Web Panel (CWP) on CentOS 7

May 2, 2023
The Power of Marketing in Real Estate: A Guide to Boost Your Business https://thaikadar.com/secureinvestment/
2 min read
  • Article By Spoke Right
  • Blog By Spoke Right
  • Circular Byte Private Limited

The Power of Marketing in Real Estate: A Guide to Boost Your Business

January 30, 2023
  • Home
  • Our Services
  • Free Education
  • Spoke Right News
  • Earn Online
  • Classic Games by Spoke Right
  • Contact Us
Copyright © All rights reserved. | MoreNews by AF themes.