선생님 질문있습니다 이 강의를 리액트환경에서 적용하고싶은데요,
333
반가우면반갑다고해
작성한 질문수 143
0
그럴경우 useEffect 안에서 함수 처리를 해줘야할까요? 예를들어 이런식으로?
useEffect(() => {
const leaflet = document.querySelector('.leaflet');
const pageElems = document.querySelectorAll('.page');
let pageCount = 0;
function getTarget(elem, className) {
while (!elem.classList.contains(className)) {
elem = elem.parentNode;
if (elem.nodeName === 'BODY') {
elem = null;
return;
}
}
return elem;
}
function closeLeaflet() {
pageCount = 0;
document.body.classList.remove('leaflet-opened');
// 펼쳐졌을때 맨 오른쪽 페이지 닫기
pageElems[2].classList.remove('page-flipped');
setTimeout(() => {
// 이후 맨 왼쪽 페이지 닫기
pageElems[0].classList.remove('page-flipped');
}, 500);
}
leaflet.addEventListener('click', (e) => {
let pageElem = getTarget(e.target, 'page');
if (pageElem) {
pageElem.classList.add('page-flipped');
pageCount++;
if (pageCount === 2) {
document.body.classList.add('leaflet-opened');
}
}
// let closeBtnElem = getTarget(e.target, 'close-btn');
// if (closeBtnElem) {
// closeLeaflet();
// zoomOut();
// }
// let menuItemElem = getTarget(e.target, 'menu-item');
// if (menuItemElem) {
// zoomIn(menuItemElem);
// }
// let backBtn = getTarget(e.target, 'back-btn');
// if (backBtn) {
// zoomOut();
// }
});
}, []);
답변 1
연애인 사주는 그냥 넣어도 상관없나요?
0
22
1
14강. 업체 연결이 필요하신 분은 개인톡으로 문의해주세요.
0
26
1
인프당 무당 캐릭터 뽑는 프롬프트
0
32
2
10월 15일 삭제예정 강의 문의
0
40
1
강의가 중복됐어요
0
55
1
transform-style: preserve-3d; 를 추가하면
0
127
1
Babel의 사용법 아래 링크의 영상이 비공개 동영상이라고 뜹니다.
0
171
1
페이지 클래스리스트 제거 해줬을때
0
135
0
페이지를 클릭할 때 Uncaught TypeError: Cannot read properties of undefined (reading 'contains') 에러가 뜹니다.
0
1102
1
질문 있습니다ㅠ.ㅠ..
0
456
1
클릭 시 자꾸 page element만 인식됩니다.
0
292
1
가운데 페이지만 줌인이 됩니다
0
312
1
body에 perspective를 주면 갑자기 html과 body 높이가 0이 됩니다
0
447
1
줌인 상태일 때
0
311
1
이벤트 위임 방식 질문
0
288
1
이사람 누군지 아세요..?
3
466
1
질문있습니다.
0
252
1
선생님 질문잇습니다. ㅠ
0
321
1
줌인이 왜 안되는지를 모르겠어요..
1
319
1
질문이 있어요
1
280
1
질문 있습니다.
0
423
2
선생님 질문 있습니다!
1
315
2
쌤 화면 크기 줄엿을때 글자들 삐져나오는거는 어떻게 해결하죠?
0
452
2
소스코드 압축이 풀리지 않습니다.
0
412
4