React alert창 띄운 후 확인 버튼 누르면 값 갱신 안되게 하는 방법ㅠㅠ
3173
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>
react
reactjs
웹페이지
프론트엔드
回答 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>;
토큰오류 아시나요?
0
6
1
유튜브 시연 영상 추가 기능 강의 업로드 계획
0
5
1
(VS코드) install command 아무리 해도 안나옵니다
0
10
1
강의 수강 후 포트폴리오 준비 방향에 대해 조언 부탁드립니다.
1
12
1
@/styles/globals.css'
0
15
2
VS Code의 Command pallet에서 'install command'해도 'code' command가 안보입니다.
0
21
1
파일 디렉토리 구조가 다르네요
0
20
1
클로드 초기설정
0
24
1
슬슬 따라하기가 힘들어진다.
0
61
2
[문의] 섹션 7 미션 진행 중...
0
27
2
기본 브랜치의 이름이 master에요.
0
38
2
관리자 페이지 질문
0
20
1
plans 생성이 안됩니다.
0
34
3
더빙에 어떤 ai가 쓰였는지 궁금합니다.
0
41
2
보안 적용에 대한 강의가 있을까요?
0
28
2
Auto-memory 기능
0
28
2
64강 context 7 관련 질문
0
31
2
Auto-memory 기능
0
26
1
55강 7분56초
0
24
1
55강 git 초기화 관련 질문이요
0
28
2
클로드 코드에 붙여넣기후 편집 관련 질문입니다!
0
30
2
존재하지 않는 일기 url입력 시 alert이 두 번 떠요
0
32
1
윈 터미널의 클로드와 에디터의 터미널의 클로드에 관한 질문
0
18
2
output-styles 명령어 없어 지지 않았나요?
0
27
2

