[Vue.js/에러일지] autofocus processing was blocked because a document already has a focused element

 

에러

<input> 태그에 autofocus 속성을 적용하였으나 마운트 될 때 focus가 되지 않는 현상

autofocus processing was blocked because a document already has a focused element

 

 

원인

기존 창 위에 뜬 모달이라 이미 focus가 잡힌 엘리먼트가 있어서 생긴 에러이다.

onMount() 할 때 해당 엘리먼트의 ref에 focus() 이벤트를 걸어주었다.

onMounted(() => {
  nextTick(() => {
    if (InputRef.value) {
      InputRef.value.focus()
    }
  })
})

 

 

 

---

개인적으로 공부한 내용을 정리하는 블로그로
잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.