728x90
반응형
[Vue warn]: Property or method "onSubmitForm" is not defined on the instance but referenced during render.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>끝말잇기</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="root">
<div>{{word}}</div>
<form v-on:submit="onSubmitForm">
<input type="text" v-model="value">
<button type="submit">입력!</button>
</form>
<div>{{result}}</div>
</div>
<script>
const app = new Vue({
el: '#root',
data: {
word: '제로초',
value: '',
result: '',
},
method: { //<<<<<<<<-- 주의!! method(X) -> methods(O) .....
onSubmitForm(e) {
e.preventDefault();
if(this.word[this.word.length - 1] === this.value[0]) {
this.result = '딩동댕';
} else {
this.result = '땡';
}
}
},
});
</script>
</body>
</html>인프런에서 조현영님의 '웹 게임을 만들며 배우는 Vue' 를 듣는 도중 분명히 잘 따라쳤는데 계속 위와같은 오류가 생겼는데 도저히 이해를 할 수가 없었다. 원인은 method..... method(X) -> methods(O) ... vue를 처음 쓰다보니 이런 오타 발견하기가 어렵다.
반응형
'개발 > 에러 잡기' 카테고리의 다른 글
| CSS 변경사항이 반영이 안될 때 확인해 볼 것들.(feat. 캐시삭제) (0) | 2021.04.19 |
|---|---|
| JSP 연습 중 발생한 에러..... (feat. 틀린 그림(코드) 찾기) (0) | 2021.04.04 |
댓글