v-on:click= " " 내부의 this는 무엇을 가리키나요? 그리고 안에는 뭐가 들어가나요?
미해결
Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념
저번에도 비슷한 질문을 했었는데 해주신 답변이 안녕하세요, "v-on:이벤트명"의 대상으로는 해당 컴포넌트의 메서드 이름이 올 수 있다고 보시면 됩니다. logText() 형태가 아니라 logText로 써주셔야 합니다 :) 였습니다 근데 case 1) <button @click="this.message+='!'">{{ this.message }}</button> -> TypeError: Cannot read properties of null case 2) <button @click="message+='!'">{{ this.message }}</button> --> 정상적으로 '!'가 뒤에 추가됨 case 3) <button @click="addMessage">{{ this.message }}</button> --> 정상적으로 '!'가 뒤에 추가됨 case 4) <button @click="addMessage()">{{ this.message }}</button> --> 정상적으로 '!'가 뒤에 추가됨 case 5) <button @click="this.addMessage">{{ this.message }}</button> --> 정상적으로 '!'가 뒤에 추가됨 case 6) <button @click="this.addMessage()">{{ this.message }}</button> -> TypeError: Cannot read properties of null 예시가 길었습니다! 그래서 질문입니다 1) v-on:click ="" 내부에서 this.메서드() 하면 this가 null 취급을 받는데 this.메서드 하면 this가 null 취급을 안 받는 이유가 뭔가요? 2) 그럼 왜 {{ this.message }} 의 this는 null 취급을 안 받나요? 3) 그래서 v-on:click="" 안에는 함수 참조가 들어가는 건가요 아니면 함수 호출문이 들어가는 건가요? case3, case4를 보면 함수 참조, 함수 호출문 둘다 들어갈 수 있는데 또 case 5, case6을 보면 모르겠습니다.
- this
- vuejs
- 이벤트핸들러
- javascript