<<Detail.js>
import { useContext, useEffect, useState } from "react";
import { Nav } from "react-bootstrap";
import { useDispatch } from "react-redux";
import { useParams } from "react-router-dom";
import styled from 'styled-components';
import {Context1} from './../App.js'
import { addItem } from "./../store.js";
function Detail(props){
let {stock, jewerly} = useContext(Context1);
let [count,setCount] = useState(0);
let [alert_a, setAlert] = useState(true);
let {id} = useParams();
let findJewerly = jewerly.find(function(x){
return x.id == id
});
let [input, setInput] = useState('');
let [tab, setTab] = useState(0);
let [fade2, setFade2] = useState(false);
let dispatch = useDispatch();
useEffect(()=>{
// let a = setTimeout(()=>{ setAlert(false) }, 2000 )
// console.log(2)
// if (isNaN(input) == true) {
// alert('숫자만')
// }
// return ()=> {
// console.log(1)
// clearTimeout(a)
// }
setTimeout(()=>{setFade2('end')}, 100)
return()=>{
setFade2('')
}
// tab 변경될 때마다 코드 실행해줌
// console.log(findJewerly.id);
}, [])
useEffect(()=>{
console.log("찾은상품.id : " + findJewerly.id);
if(localStorage.getItem('watched') == null){
let 꺼낸거 = localStorage.getItem('watched')
꺼낸거 = JSON.parse(꺼낸거)
꺼낸거.push(findJewerly.id)
localStorage.setItem('watched', JSON.stringify(꺼낸거))
}
}, [])
<<App.js>>
import { createContext, useState, useEffect } from 'react';
import './App.css';
import 'bootstrap/dist/css/bootstrap.min.css';
import { Button, Container, Nav, Navbar, Row, Col } from 'react-bootstrap';
import data from './data.js';
import { Routes, Route, Link, useNavigate, Outlet } from 'react-router-dom';
import Detail from './pages/Detail';
import Cart from './pages/Cart';
import axios from 'axios';
export let Context1 = createContext()
function App() {
useEffect(() => {
localStorage.setItem('watched', JSON.stringify([]) )
}, []);
이렇게 했는데 로컬스토리지 watched에 id 추가가 안됩니다 ㅠㅠ
