본문 바로가기

input

(2)
못말리는 Input 달래주기 2편 (이모지 입력) 안녕하세요 WEB 김채현입니다! BEAT는 대학생 공연 동아리들이 타겟층이기 때문에 공연명, 소개, 유의사항 등에 이모지가 들어갈 수 있다고 생각했습니다.그런데 이모지를 입력하면 이슈가 발생했는데요...🥹🥹 ⚠️ 이모지는 한 글자가 아니다. 글자수가 5로 되어야 하는데 이상하게 이모지마다 글자수가 다르고 심지어 이모지 하나에 11을 차지하기도 했습니다. 이유가 무엇일까요?이모지는 유니코드에 포함되어 있습니다. 유니코드 평면 중 다국어 보충 평면(SMP)에 포함되어 있는데이 평면에서 U+1F000 ~ U+1F9FF 영역에 이모지가 위치해있습니다.하지만 모든 이모지가 이 유니코드 평면에 존재하지는 않습니다.이모지에는 여러 유니코드 문자가 결합되어 하나의 이모지를 표현하는 이모지 시퀀스 (Emoji Seq..
못말리는 Input 달래주기 1편 (숫자 입력) 안녕하세요! WEB 김채현입니다.BEAT는 공연 정보, 공연진 정보, 예매 정보 등 다양한 정보를 입력해야 하기 때문에 Input 컴포넌트가 많이 쓰이는 서비스이고, Input 공통 컴포넌트 제작을 맡게 되었습니다. 입력하는 항목들이 가격, 수량, 이름 등 다양한 종류가 있어서 `filter`를 `prop`으로 주어서 각 항목에 맞게 필터링을 하도록 구현했습니다. // 값 입력될 때  const handleOnInput = (e: ChangeEventHTMLInputElement>) => {    const inputName = e.target.name;    let inputValue = e.target.value;    if (filter) {      inputValue = filter(inputV..