Comments (4)
Souravkkt0404
commented on June 11, 2024
//class based
import React, { Component } from 'react';
class Counter extends Component {
constructor(props) {
super(props);
this.state = {
count: 0
};
}
increment = () => {
this.setState({ count: this.state.count + 1 });
};
render() {
return (
Count: {this.state.count}
Increment
);
}
}
export default Counter;
//function based
import React, { useState } from 'react';
const Counter = () => {
const [count, setCount] = useState(0);
const increment = () => {
setCount(count + 1);
};
return (
Count: {count}
Increment
);
};
export default Counter;
from reactjs-interview-questions.
srd11
commented on June 11, 2024
Using function based ,useState hook
import React, {useState} from 'react'
const Message = () => {
const [message,setMessage] = useState('Welcome visitor');
const changeMessage = () => {
setMessage('Thank you for visting!');
}
return(
<div>
<h1>{message}</h1>
<button onClick = {() => changeMessage()}>Subscribe</button>
</div>
)
}
Using class component same code.
import React, { Component } from 'react'
class Message extends Component{
constructor() {
super()
this.state = {
message: 'Welcome visitor'
}
}
changeMessage() {
this.setState({
message: 'Thank you for visting! '
})
}
render() {
return (
<div>
<h1>{this.state.message}</h1>
<button onClick = {() => this.changeMessage()}>Subscribe</button>
</div>
);
}
}
;
from reactjs-interview-questions.
oppabgnamdz
commented on June 11, 2024
Dear reply+ANQ7EA5O5ACOPWMIM67NXNODYWIKPEVBNHHGTMFSRE,
Thank you so much for contacting qweq.
We have received your e-mail message and we have already create a support ticket for this issue.
An agent will follow up with you as soon as possible and he/she will assist you for this issue.
Please note: This e-mail was sent from a notification-only address that cannot accept incoming e-mail.
Please do not reply to this message.
=================================================
Your message to us:
Using function based ,useState hook
import React, {useState} from 'react'
const Message = () => {
const [message,setMessage] = useState('Welcome visitor');
const changeMessage = () => {
setMessage('Thank you for visting!');
}
return(
<div>
<h1>{message}</h1>
<button onClick = {() => changeMessage()}>Subscribe</button>
</div>
)
}
Using class component same code.
import React, { Component } from 'react'
class Message extends Component{
constructor() {
super()
this.state = {
message: 'Welcome visitor'
}
}
changeMessage() {
this.setState({
message: 'Thank you for visting! '
})
}
render() {
return (
<div>
<h1>{this.state.message}</h1>
<button onClick = {() => this.changeMessage()}>Subscribe</button>
</div>
);
}
}
;
—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>
[
{
***@***.***": "http://schema.org",
***@***.***": "EmailMessage",
"potentialAction": {
***@***.***": "ViewAction",
"target": "#261 (comment)",
"url": "#261 (comment)",
"name": "View Issue"
},
"description": "View this Issue on GitHub",
"publisher": {
***@***.***": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
}
]
from reactjs-interview-questions.
sudheerj
commented on June 11, 2024
@hamzaDev654 Thanks for the feedback. It is currently in progress to update them.
from reactjs-interview-questions.
Related Issues (20)
- Can `key` have other types? HOT 1
- What is the difference between Decorators and HOCs? HOT 4
- For Naming Convention of React props HOT 1
- Question 2 to 10 are not in correct order. HOT 1
- I have added detailed answer for Question 41 and created PR #243 HOT 1
- React is not present in import section in Question No. 8 HOT 2
- ReactJs interview questions
- Please provide more reasoning to Q12 HOT 2
- React interview questions
- React
- fix: readme table of content 2nd point HOT 1
- Incorrect code sample for Q 335 HOT 1
- React js
- Table of Contents is too long maybe make it a collapsible section HOT 6
- React
- React interview questions
- Make a website for this github repo HOT 2
- React.js
- Pdna
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from reactjs-interview-questions.