목차
- 왜 필요한가?
- 필요한 기능
- 복사 후 붙여넣기 (테이블과 같은 정형 데이터는 ,등으로 분류)
- 하나의 셀 편집 기능
- 어떻게 구현했는지?
- 복사 후 붙여넣기
- 붙여넣기 한 text를 , 또는 \t 단위로 잘라냄 개행은 \n
- 편집기능
- 가지고 있는 Position에 TextInput 끼어넣기
- 원본데이터 업데이트 및 컴포넌트 사용하는 곳에 업데이트 알림
- javascript의 깊은 복사와… 얇은 복사의 슬픔
- 복사 후 붙여넣기
- 이때와 지금과 다른점
- map을 사용하면 어떨까?
왜 필요한가?
JDBC로 mariaDB 또는 mysql의 데이터베이스 연결 후 데이터를 추가하거나 업데이트하는 일이 필요해졌다. 그 데이터의 양이 1개 2개 라면 상관없지만 적게는 100개 많게는 10,000개 이상의 데이터를 데이터베이스에 직접 적재하는 과정이 필요했고 이 데이터를 클라이언트에서 추가해서 배열 형식으로 보내주면 서버는 이를받아 데이터베이스에 직접 추가하는 방식이었다.
필요한 기능
선행기능
- 셀 선택 기능
- 붙여넣거나 편집할 위치를 알기 위해 선택하는 셀 자체의 위치를 알아야한다.
- 드래그 선택
- 드래그 한 영역의 범위를 알아야 선택된 영역의 범위를 덮을 수 있다.
아무 웹사이트 내의 있는 테이블 데이터를 복사 할 수 있어야 했다.
테이블은 \t, \n, \, 등으로 개행 등을 구분한다.
- \n은 하나의 배열 공간을 차지하고
- \t는 하나의 컬럼값의 해당하므로 객체안의 데이터이다
- \,은 오브젝트안의 값이다.
편집기능은 쉬워야 한다.
- 사용자의 특정 키 입력에 따라 수정 모드로 진입, 나가기 할 수 있어야한다.
- enter, esc 등
- 알파벳의 키코드
원본 데이터를 업데이트 및 컴포넌트 사용자가 알아야 한다.
- 편집시 변경 점을 알려주어야 함
구현을 하며 문제점
- javascript의 복사는 주소만 카피하므로 변경 데이터를 비교하는데 어려움이 있다.
- 한글의 자모음이 끝나는 부분에서 enter키의 타이밍은 영문과 다르다.
이때의 코드를 변경하고 싶은것
- 그냥 javascript의 map을 사용했다면 어떨까?