본문 바로가기
반응형

Dev. Yelee ˗ˋˏϟˎˊ˗99

React i18n :: key에 콜론(:)이 있을때 권장하지 않는 방식이지만 현재 팀에서 영문 번역 값을 json 파일의 키로 사용하고 있다보니 여러 이슈가 발생하고 있다. common.json { ex.0123:4567:89ab:cdef:0123:4567:89ab:cdef: 'ex.0123:4567:89ab:cdef:0123:4567:89ab:cdef' } 그중 하나로 이렇게 key에 콜론(:)이 들어가 있는 경우인데 (사실 이 경우에 번역이 필요하진 않지만,,) 아무튼 저 키를 번역하면 console.log(t(`ex.0123:4567:89ab:cdef:0123:4567:89ab:cdef`)) // '4567.89ab.cdef.0123.4567.89ab.cdef' 이렇게 'ex.0123:'이 제거되고 4567부터 출력되는 것을 확인할 수 있다. 원인 .. 2023. 1. 26.
리액트에서 컴포넌트의 높이(height), 넓이(width) 구하기 useRef를 이용하자! const Test = props => { const anchorRef = useRef(null); console.log(anchorRef.current?.offsetWidth) // 컴포넌트의 width console.log(anchorRef.current?.offsetHeight) // 컴포넌트의 height return ( hi! )} 주의 offsetWidth, offsetheight 값은 렌더가 완료된 컴포넌트에서 가져올 수 있다. useRef로 가져온 dom이 렌더가 완료되기 전에는 undefined 상태일 수 있기에 반드시 옵셔널 체이닝 '?' 을 해주자! 덧붙여서 const Test = props => { const anchorRef = useRef(null); c.. 2023. 1. 25.
스토리북에서 addon-controls 패널이 사라졌을때 해결 방법 스토리북에서 이것저것 테스트 해보는데 저 Controls가 사라질 때가 있다 (아무래도 단축키를 잘못 눌러서 그런 거 같은데 단축키가 뭔지 까먹음,,) 그래서 일단 급한 해결책으로 찾은 방법은 개발자 도구 -> 애플리케이션 -> 로컬 스토리지에서 storybook-layout 키를 삭제하는 것인데 이걸 쓰는 순간 단축키가 뭔지 떠올랐다 그냥 A 버튼 누르시면 됩니다 2023. 1. 18.
크롬 브라우저에서 티스토리 로그인 안될때 (400 Error) 티스토리 놈들,, 회사 컴퓨터로 티스토리 로그인을 했는데 계속 400 에러가 발생했다. 회사 VPN에서 갑자기 막은 건가 생각했는데 검색해 보니 많은 사용자들에게 가끔 발생하는 현상인거 같다 해결방법 - 크롬 브라우저 우측 상단에 더보기 버튼 -> 설정 탭 클릭 - 개인 정보 보호 및 보안 탭 -> 인터넷 사용 기록 삭제 클릭! 어제까지는 로그인이 잘 됐기 때문에 일단 지난 24시간으로 기간을 설정한 후 인터넷 사용기록, 쿠키, 캐시를 삭제해 주었다. 후,, 이 방법으로 로그인에서 이 글을 쓸 수 있었다,,, 2023. 1. 17.
반응형