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)
최근 글
인기 글
최근 댓글
태그
  • #리액트
  • #러닝
  • #백준
  • #node.js
  • #자바스크립트
  • #Javascript
  • #백준알고리즘
  • #모딥다
  • #react
  • #타입스크립트
전체 방문자
오늘
어제
전체
반응형
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바