Drag and Drop Tutorial #2
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
yuda1124
reviewed
May 9, 2021
| function Card(props) { | ||
| const dragStart = (e) => { | ||
| const target = e.target; | ||
| e.dataTransfer.setData("card_id", target.id); |
There was a problem hiding this comment.
이벤트에 데이터를 전달하는 것보다 state로 현재 드래그 중인 카드를 관리하는 게 더 좋을 것 같습니다.
| const target = e.target; | ||
| e.dataTransfer.setData("card_id", target.id); | ||
| setTimeout(() => { | ||
| target.style.display = "none"; |
There was a problem hiding this comment.
직접 돔을 수정하는 것보다 조건부 렌더링이 좋을 것 같아요.
| }; | ||
|
|
||
| const dragOver = (e) => { | ||
| e.stopPropagation(); |
| </Card> | ||
| </Board> | ||
|
|
||
| <Board id="board-2" className="board"> |
There was a problem hiding this comment.
React의 defaultProps와 같은 부분을 사용해서 하드코딩한 부분을 목데이터를 통해서 생성하는 게 좋을 것 같습니다.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Issue #1 에 대한 기능 구현입니다.
체크리스트
관련 이슈
설명