import React, { useEffect, useState } from "react";
import "./App.css";
import axios from "axios";
import styled from "styled-components";
function App() {
localStorage.setItem("searchList", JSON.stringify([]));
const [value, setValue] = useState("");
const handleInput = (e) => {
setValue(e.target.value);
};
const submit = (e) => {
e.preventDefault();
let findItem = localStorage.getItem("searchList");
findItem = JSON.parse(findItem);
findItem.push(value);
localStorage.setItem("searchList", JSON.stringify(findItem));
};
return (
<div className="App">
<button onClick={test}>클릭하면 기사 나옴</button>
<form onSubmit={submit}>
<input type="text" onChange={handleInput} value={value} />
<button type="submit">localStorage에 저장</button>
</form>
{value}
</div>
);
}
function Card({ title }) {
return <>{title}</>;
}
input에 값을 입력하고 submit 하면 로컬스토리지의 배열에 입력한 값이 저장되게 하고 싶은데, 새로고침을 하면 값이 전부 사라집니다. 어떻게 해야 할까요?
localStorage.setItem("searchList", JSON.stringify([])); 맨 위에 이 코드 때문에 로드 될때마다 새로 만들어져서 그런것 같은데,, 어떤방법이 있을까요,,?
