๋ชฉ๋กuseState (2)
๐ค ์์งlog ๐ค
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bNGEGX/btrX32HlrlF/K7CEQJnH7BQ3U8HLd7Fxo0/img.gif)
๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ง ์๊ณ { useState ์ useEffect } ๋ฅผ ์ฌ์ฉํด์ ์ง์ ๊ตฌํํด๋ณด๊ธฐ๋ก ํ์๋ค ! ๐ฅ ๊ทธ์ ์๋ react-bootstrap์ผ๋ก๋ง ํด๋ดค๋ํฐ๋ผ,, ์กฐ๊ธ ๊ฑฑ์ ํ๋๋ฐ ์ญ์๋ ์ด๋ ค์ ์ง๋ง ์ ๋ณด๋ ๋ง์๊ณ , ์ด๊ฒ ์ ๊ฒ ์๋ก ์๋ํด๋ณด๋ ์ฌ๋ฏธ๋์์๋ค -๐ ๐ ๊ตฌํ ์ฝ๋ import { useEffect, useState } from "react"; import { Link } from "react-router-dom"; import styled from "styled-components"; import { SLIDE_DATA } from "datas/slide"; const Banner = () => { const [currentSlide, setCurrentSlide] = useState(..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/KPk5z/btrNXZyyQ7J/N6JIs3HszgmNusyqsauyi1/img.png)
Hooks ๋ ๋ฆฌ์กํธ v16.8 ์ ์๋ก ๋์ ๋ ๊ธฐ๋ฅ์ผ๋ก์, ํจ์ํ ์ปดํฌ๋ํธ์์๋ ์ํ ๊ด๋ฆฌ๋ฅผ ํ ์ ์๋ useState, ๊ทธ๋ฆฌ๊ณ ๋ ๋๋ง ์งํ ์์ ์ ์ค์ ํ๋ useEffect ๋ฑ์ ๊ธฐ๋ฅ๋ฑ์ ์ ๊ณตํ์ฌ ๊ธฐ์กด์ ํจ์ํ ์ปดํฌ๋ํธ์์ ํ ์ ์์๋ ๋ค์ํ ์์ ์ ํ ์ ์๊ฒ ํด์ค๋ค. โ๏ธ useState import { useState } from 'react' const [๋ณ์, set(๋๋ฌธ์)๋ณ์] = useState(''); setํจ์์ ์์ ๊ฐ prev( ) ์ ๋ฃ๊ณ ์ถ์ผ๋ฉด ์ฝ๋ฐฑํจ์๋ฅผ ์ฌ์ฉํด์ผํ๋ค. filter ํจ์๋ ์ฝ๋ฐฑ ํจ์์ ์กฐ๊ฑด์ ํด๋นํ๋ ๋ชจ๋ ์์๊ฐ ์๋ ๋ฐฐ์ด์ ์๋ก ์์ฑํ๋ ๊ธฐ๋ฅ์ ํ๋ค. import { useState } from 'react' const Counter2 = () => { c..