인프런 커뮤니티 질문&답변

jjkim0222님의 프로필 이미지
jjkim0222

작성한 질문수

Vue3 완벽 마스터: 기초부터 실전까지 - "기본편"

Events

이벤트 핸들러로 왜 일반 함수로는 작동이 안 되나요? + console.log도 인식이 안되요

작성

·

290

0

정상 작동
<input
  @input="
    e => {
      e.target.value += '!';
      console.log('hi');
    }
  "
/>

에러 뜸
<input
  @input="
    function(e) {
      e.target.value += '!';
  "
/>

질문1) 화살표 함수를 일반함수로 바꿨더니 에러가 뜨면서 화면이 안떠져요

질문2) 이벤트 핸들러를 화살표 함수로 작성하면e.target.value += '!' 는 정상 작동되는데

console.log()에서 Uncaught TypeError: Cannot read properties of undefined (reading 'log')가 뜹니다

이유가 뭔가요?

답변 1

0

짐코딩님의 프로필 이미지
짐코딩
지식공유자

안녕하세요.

질문1) 화살표 함수를 일반함수로 바꿨더니 에러가 뜨면서 화면이 안떠져요

-> 중괄호가 누락된 것 같습니다.

@click="function () { ... }"

질문2) 이벤트 핸들러를 화살표 함수로 작성하면e.target.value += '!' 는 정상 작동되는데

-> 이벤트 핸들러에는 컴포넌트 인스턴스의 속성을 사용할 수 있습니다. console과 같은 전역객체는 사용할 수 없습니다. (Vue 스팩입니다.)

jjkim0222님의 프로필 이미지
jjkim0222

작성한 질문수

질문하기