import { useContext, useEffect, useState } from 'react';
import { ThemeContext } from './ThemeContext';

export const Box = () => {
    // const theme = useContext(ThemeContext);
    const { primary, secondary } = useContext(ThemeContext);

    // const [<상태 값 저장 변수>, <상태 값 갱신 함수>] = useState(<상태 초기 값>);

    let bgColor = primary.main;
    let txColor = primary.text;

    const [statBgColor, setStatBgColor] = useState(bgColor);
    const [statTxColor, setStatTxColor] = useState(txColor);

    useEffect(() => {
        setTimeout(() => {
            setStatBgColor(secondary.main);
            setStatTxColor(secondary.text);

            console.log('색상변경!');
        }, 3000);
    }, []);

    return <div style={{ backgroundColor: statBgColor, color: statTxColor }}>Theme context</div>;
};




제이쿼리 한줄이면 끝나는거 몇개를 써야되는거냐