lurgi
close
프로필 배경
프로필 로고

lurgi

  • 분류 전체보기 (207)
    • 카공 카페 모음 (9)
    • 개발관련 (189)
      • Front End (6)
      • Next (8)
      • Javascript (12)
      • etc (3)
      • React (27)
      • 개발 상식 (24)
      • 기술 서적 (4)
      • 알고리즘 (0)
      • 하루 30분 모딥다 (22)
      • 하루 30분 러닝 타입스크립트 (11)
      • 리액트 딥 다이브 (6)
      • 백준 (31)
      • 프로그래머스 (4)
      • 객체 지향 & 설계 (6)
      • CSS (4)
      • 디자인 패턴 (13)
      • 우아한 테크코스 6기 (1)
      • 우아한 테크코스 6기 프리코스 (7)
      • 우아한 테크코스 6기 글쓰기 (0)
  • 홈
  • 태그
  • 방명록
반응형
[React] Drag & Drop (DnD) 직접 구현하기 (2). Mouse Event와 상태관리를 사용하여 구현하기

[React] Drag & Drop (DnD) 직접 구현하기 (2). Mouse Event와 상태관리를 사용하여 구현하기

기존에 Drag Event를 통해 드래그 앤 드롭 기능을 구현했지만, 페이지 레이아웃이 변경되거나 요소가 다시 렌더링되는 Reflow 상황에서 이벤트가 중단되었습니다. 이로 인해 드래그 중이던 요소가 예상치 못한 위치에 놓이거나, 드래그 자체가 취소되는 문제가 발생했습니다.이 문제를 해결하기 위해 Mouse Event를 사용하여 드래그 기능을 다시 구현하기로 결정했습니다. Mouse Event는 Reflow의 영향을 받지 않아 안정적인 이벤트 처리가 예상했으나, event.dataTransfer 객체를 사용할 수 없다는 점이 문제가 있었습니다.event.dataTransfer는 Drag & Drop 과정에서 데이터를 전달하는 데 사용됩니다. Mouse Event로 전환하면서 이 객체를 사용할 수 없게 되..

  • format_list_bulleted React
  • · 2024. 9. 17.
  • textsms
반응형
  • navigate_before
  • 1
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (207)
    • 카공 카페 모음 (9)
    • 개발관련 (189)
      • Front End (6)
      • Next (8)
      • Javascript (12)
      • etc (3)
      • React (27)
      • 개발 상식 (24)
      • 기술 서적 (4)
      • 알고리즘 (0)
      • 하루 30분 모딥다 (22)
      • 하루 30분 러닝 타입스크립트 (11)
      • 리액트 딥 다이브 (6)
      • 백준 (31)
      • 프로그래머스 (4)
      • 객체 지향 & 설계 (6)
      • CSS (4)
      • 디자인 패턴 (13)
      • 우아한 테크코스 6기 (1)
      • 우아한 테크코스 6기 프리코스 (7)
      • 우아한 테크코스 6기 글쓰기 (0)
최근 글
인기 글
최근 댓글
태그
  • #Javascript
  • #node.js
  • #react
  • #자바스크립트
  • #타입스크립트
  • #백준
  • #리액트
  • #모딥다
  • #백준알고리즘
  • #러닝
전체 방문자
오늘
어제
전체
반응형
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.