드래그앤드롭 문제 - boostcamp-2020/Project15-A-Client-Based-Formula-Editor GitHub Wiki
1. 드래그해서 떨어뜨린 컴포넌트의 위치를 알아낸 후, 어떻게 해야 딱 그 위치에 해당 컴포넌트가 가지고 있는 수식을 넣을 수 있을까
[해결 방법]
- 드래그해서 떨어뜨린 컴포넌트의 위치 구하기
// 드래그 컴포넌트를 드롭 컴포넌트에 떨어뜨리면 호출되는 함수 : drop()
drop(item: { name: string; type: string; latex: string }, monitor) {
// 드래그 컴포넌트의 y, x 좌표를 알 수 있다.
// clientOffset.x, clientOffset.y
const clientOffset = monitor.getClientOffset();
},
- mathquill 공식 문서 정독
// 입력 좌표로 커서를 옮길 수 있다.
mathQuiiFunc.clickAt(x, y);
// 현재 커서 위치에 string을 입력 할 수 있다.
mathQuiiFunc.write(latexString);
- 해당 위치에 latex string을 넣어주는
handleClientOffset(x, y, latexString)함수 작성
const handleClientOffset = (x: number, y: number, latexString: string) => {
mathQuiiFunc.clickAt(x, y);
mathQuiiFunc.write(latexString);
};