Scribd
Upload
4 views

sample

Uploaded by

sarah mae borromeo
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
4 views

sample

Uploaded by

sarah mae borromeo
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

"use client"

import React, { useEffect, useState } from 'react'

const page = () => {


const [data, setData] = useState([])
const [email, setEmail] = useState('')
const [password, setPassword] = useState('')

const handleChangeEmail = (value) => {


setEmail(value)
}

const handleChangePassword = (value) => {


setPassword(value)
}

const handleSubmit = () => {

if (email && password) {

// for local storage


const payload = {
email,
password
}

// setting up the actual data state


setData((prev) => {
return [...prev, payload]
})

} else {
console.log("Wala pang laman")
}
}

useEffect(()=>{
localStorage.setItem('user',JSON.stringify(data))
},[data])

return (
<div>
<input type="text" onChange={(e) => {
handleChangeEmail(e.target.value)
}} />
<input type="text" onChange={(e) => {
handleChangePassword(e.target.value)
}} />
<button onClick={handleSubmit}>Submit</button>

<div style={{
marginTop:'1rem'
}}>
<h1>List of users</h1>
{data?.map((item, index) => (
<pre style={{
color: 'black',
marginBottom:'1rem'
}} key={index}>
Email: {item?.email}<br/>
Password: {item?.email}
</pre>
))}
</div>
</div>
)
}

export default page

You might also like