input 자동완성 background-color 변경하기
CSS 2021. 9. 12. 18:10

input에 background가 설정되어 있지 않은데 자꾸 background-color가 적용되는 현상이 있었다. input에 아이콘이나 이미지가 들어가 있을 때 input 영역 값에 저 색이 들어가니 몹시 불_편했다. 찾아보니 자동완성 기능을 사용 할 때 생기는 스타일링이였다! input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; -webkit-transition: background-color 9999s ease-out; -webkit-box-shadow:..

useRef , input 컨트롤, 커서 위치 이동 with antd
ReactJS 2021. 8. 10. 21:08

React에서는 useRef를 이용해 특정 DOM을 선택할 수 있습니다. useRef에 대해서는.... 검색하면 많은 자료가 나오니 패스합니다. input에 기본 값을 주고 포커스 되었을 때 커서를 가장 뒤로 보내주기 위해 useRef를 사용하였고, 그 과정을 소개하고자 합니다. 먼저 antd의 input 태그를 사용하였으며, focus 안에 있는 cursor 객체는 antd에서만 되는듯 했다. 일반 input태그에서는 확인해보지 못했습니다.. 만약 일반 input에서 저게 안된다면 useRef.current로 console.log 찍어 보시면 해당 input의 value를 받아 올 수 있습니 다. 그 value의 length값을 가지고 useRef.current 안에 있는 selectionStart ,..