Scribd
Upload
4 views4 pages

Rendaring

The document contains multiple React component implementations, each demonstrating different ways to handle user login status and button interactions. It includes examples of rendering lists of cities, conditional rendering based on a boolean status, and handling button click events with various methods. The components are structured to return JSX elements and export the main app function.

Uploaded by

tanverahammad661
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views4 pages

Rendaring

The document contains multiple React component implementations, each demonstrating different ways to handle user login status and button interactions. It includes examples of rendering lists of cities, conditional rendering based on a boolean status, and handling button click events with various methods. The components are structured to return JSX elements and export the main app function.

Uploaded by

tanverahammad661
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

const app = () => {

const city=
['dhaka','delhi','london','japan','sylhet','rangpur','mymensingh','chitta
gong','rajshahi','khulna','comilla','bogra','coxs bazar']
return (
<div>
<ol>
{
city.map((item,i)=>{

return <li key={i.toString()}>{item}</li>

})

const app= () => {


const status=true;

switch(status){
case true:
return <button>logout</button>
case false:
return <button>login</button>
default:

return null

};

export default app


const app = () => {
let status=true;
return (
<div>
{
status?
<button>logout</button>
:

const app = () => {


let status=true;
return (
<div>
<h1>login status</h1>
{status && <button>logout bouton</button>}
</div>
)
}

export default app

const app = () => {


let status=false;
return (
<div>
<h1>login status</h1>
{(()=>{

if (status==true){
return <button>logout button</button>
}
else{
return <button>login button</button> }
})()}
</div>
)
}

export default app


const app = () => {
return (
<div>
<button onClick={()=>{
alert('done')
}}>Submit</button>

</div>
)
}

export default app

const app = () => {


return (
<div>
<button onClick={
function demo(){
alert('click')
}

}>Submit</button>
</div>
)
}

export default app


const app = () => {
function Demo(){
alert('click');
}
return (
<div>
<button onClick={Demo}>Submit</button>
</div>
)
}

export default app

You might also like