React alert창 띄운 후 확인 버튼 누르면 값 갱신 안되게 하는 방법ㅠㅠ
3175
namuneulbo
작성한 질문수 1
0
안녕하세요, react로 웹 페이지를 제작 중입니다. 다름이 아니라 3개 이상 선택하면 alert창으로('3개까지만 선택 가능합니다')라고 띄우는 것 까지는 썼는데 이제 확인을 누르면 4개도 다시 클릭이 되더라구요.. 이걸 막는 방법은 뭐가 있을까요..?
관련된 함수랑 코드를 써놓겠습니다..!
const [number, setNumber] = useState(0);
const increaseNumber = ()=>{
setNumber(number+1)
};
const decreaseNumber = () => { // number의 값을 감소시키는 함수
setNumber(number - 1);
};
const over3=()=>{
if (number>=3){
alert('3개까지만 선택 가능합니다!');
}
}
//onClick에 카운트 세는 함수 설정되어있습니다.
<div className='movieposter'>
{datas.map((movie, i)=>(
movie.value === true ?
<img className='img-responsive_clicked' src="https://movie-phinf.pstatic.net/20220214_120/1644825641315cvVKI_JPEG/movie_image.jpg?type=f125" alt={i} onClick={() => {decreaseNumber();handleClickImage(i);}} />
:
<img className='img-responsive' src='img/movie_image1.jpg' alt={i} onClick={() => {increaseNumber(); handleClickImage(i);over3()}}/>
))}
</div>
답변 1
0
const [number, setNumber] = useState(0);
const increaseNumber = () => {
const isOver = over3();
if(isOver===false){
setNumber(number + 1);
}
};
const decreaseNumber = () => {
// number의 값을 감소시키는 함수
setNumber(number - 1);
};
const over3 = () => {
if (number >= 3) {
alert("3개까지만 선택 가능합니다!");
return true
}
return false;
};
//onClick에 카운트 세는 함수 설정되어있습니다.
<div className="movieposter">
{datas.map((movie, i) =>
movie.value === true ? (
<img
className="img-responsive_clicked"
src="https://movie-phinf.pstatic.net/20220214_120/1644825641315cvVKI_JPEG/movie_image.jpg?type=f125"
alt={i}
onClick={() => {
decreaseNumber();
handleClickImage(i);
}}
/>
) : (
<img
className="img-responsive"
src="img/movie_image1.jpg"
alt={i}
onClick={() => {
increaseNumber();
handleClickImage(i);
}}
/>
)
)}
</div>;
live server, korean 을 검색해도 아무것도 나오지 않음
0
7
0
커서질문
0
14
1
강의자료
0
13
1
SUPABASE에서 AOI 선택여부
0
12
2
클로드 코드 터미널 사용시 git, git 허브 활용 법
0
15
1
mcp.json파일 생성 X
0
16
2
강의 내용이 정신이없네요 ;;
0
31
2
제 컴퓨터에서는 Claude's plan이 아래와 같이 나오는데 괜찮은 건가요?
0
18
2
강의에서 사용하는 prompt
0
15
2
window 11 환경 + git bash 터미널 statusline 반영이 안됩니다 ㅠ
0
20
2
강사님 질문있습니다.
0
18
1
프로젝트를 커밋할때 알려주세요
0
22
1
작업결과물이 수업내용의 화면이 좀 다르네요
0
30
2
강의 도중 에러가 발생합니다.
0
28
2
사진과 같이 영상에 한글이 실시간으로 영어로 번역되어 보입니다
0
26
2
커밋버튼 비활성화
0
27
2
Cursor 질문
0
23
2
웹사이트 구축 질문
0
35
1
플러그인, git repo 설치 및 삭제
0
27
1
162 자료
0
22
2
supabase mcp로 테이블 생성 보여주실떄
0
30
2
settings.local.json
0
34
2
강의자료는 어떻게 제작하시나요?
0
31
2
notion 에이전트와 prd-generator 에이전트와의 관계
0
31
2





