# onblur
[JS] 리액트에서 onFocus, onBlur 에 대해 알아보자
개발하다 보니, 기본값이 0인 input 이 있는데, 사용자가 커서를 입력할 때 0을 일일이 지워야 해서 귀찮다고 하길래,간단하게 만들어 봤다.1) input 창에 터치 또는 클릭 했을 시, 0을 공백으로 초기화 해야 한다.(그래야 안 지움)2) input 창에서 벗어

유저 검색 목록에서 유저 마이페이지로 바로 이동하기 - react onFocus, onBlur, onMouseDown
검색창을 만들 때 참고하면 좋을 것 같다

[TIL] 0622 | React with Redux, Next.js, TypeScript
✍🏻 0622 | React with Redux, Next.js, TypeScript ✓ 포커스를 잃은 리액트 ✓ 리팩토링 및 State 파생
[TIL] onFocus, onBlur
이번 프로젝트에서 파파고 API를 통해 번역할 수 있는 번역 기능을 넣었는데, 번역할 문장을 인자로 보낼 때 어떻게 해야할지 고민이 있었다. onChange로 하기에는 입력하는 동안 계속 리렌더링이 되는 문제가 있고, ref로 하려고 하니 번역할 문장 입력하는 곳에 내

[React] onFocus 와 onBlur이벤트를 사용하여 인풋창 색상 변경하기
로그인 페이지를 만드는 중 구현하기로 한 필수사항 중 인풋창을 클릭했을 때 밑줄 색이 바뀌고 인풋 바깥인 메인페이지를 다시 클릭했을 때 원래 색상으로 돌아오게 하는 기능이 있었다. 인풋창을 클릭할때마다 이벤트가 발생하는 토글 기능이 아닌 활성화된 기능을 다시 해제시켜야

내외부 구분, onBlur on react
next@10.1.3react@17.0.3Focus관련해서 일반적으로 js에서는 focusin, focusout이벤트가 있고 별도로 blur관련이벤트가 있다. 하지만 react에서는 onFocus, onBlur 두가지만 있다. 따라서 포커스가 떠남을 표현하고자 할 때는

Calling onBlur and mutating state can onClick not to fire
리액트에는 focus를 위한 이벤트가 onFocus, onBlur 두 종류가 있다. 이 때 onBlur가 다른 이벤트를 먹어서 다른 이벤트가 fire되지 않는 경우가 있다.이에 대한 해결방법으로는 releatedTarget을 활용한 방법이 있다.만약 먹히는 이벤트가 클
[TIL] 2020/11/14
Today, I Learned const { matches } = window.matchMedia('(max-width: 48rem)'); 이 코드를 통해서 만약 웹으로 접속하면, 즉, max-width설정을 통해, 48rem 이하인 디바이스에서 접속하면(m
How to control focus/onblur in Vue TextareaAutosize library
focus나 onblur속성이 어디서든 다 먹는줄 알고 <div>태그에서도 적용될 줄 알았다. 그러나 onblur 나 focus는 '입력요소'(ex.input)에만 적용되는 것이다.Vue.js로 현재 프론트페이지를 만들고 있는데 특정한 곳 외에 다른 곳을 클릭했을