공부기록
공부기록, 2021-08-05(react localstorage)
이재연
2021. 8. 5. 14:20
- react localstorage
```
import React, { useState } from "react";
const LocalStorageComponent = () => {
const [userName, setUserName] = useState("");
const [check, setCheck] = useState(false);
const saveData = () => {
const userObj = { name: userName };
window.localStorage.setItem("userName", JSON.stringify(userObj));
};
const callData = () => {
setCheck(true);
};
const onChange = (e) => {
setUserName(e.target.value);
setCheck(false);
};
return (
name="userName"
value={userName}
onChange={onChange}
placeholder="이름을 입력하세요!"
/>
저장하기
불러오기
{check ?
{window.localStorage.getItem("userName")}
: <> }
);
};
export default LocalStorageComponent;
```