Vue data를 출력하는 예제를 따라하고있었는데
음..나만 methods 에 있는 data를 불러오지 못하고 function () { [native code] }가뜨는것이다..
뭘까,..,, 구글링으로 검색후 찾아냈다.
우선 내가 출력하려고 했던 코드는 아래의 코드였다.
var test4 = new Vue({
el : '#test4',
data : {
name: '홍길동',
age : 30
},
methods :{
user_info : function(){
return '이름은 ' + this.name +' 이고 나이는 '+ this.age +'입니다'
}
}
})
<div id="test4">
<h3>{{user_info}}</h3>
</div>
<h3>{{user_info}}</h3> 를 <h3>{{user_info()}}</h3>로 변경..
<h3>{{user_info()}}</h3>
왜 이런 오류가 뜨는건지 정확히 할 수는 없지만 vue3가 나온 시점에서 종종 발생하는 것 같다.
어떤 사람은 ()가 없어도 출력이 되는 사람도있었다.
++ 기본 출력
var test3 = new Vue({
el: '#test3',
data : {
int3 : 100,
float3 : 11.11,
str3 : '문자열3',
boolean3 : true,
array3 : [10, 20, 30],
object3 : {
a1: 'a1문자열',
a2: 'a2문자열'
}
}
})
<div id="test3">
<h3>{{str3}}</h3>
<h3>{{int3}}</h3>
<h3>{{float3}}</h3>
<h3>{{boolean3}}</h3>
<h3>{{array3}}</h3>
<h3>{{array3[0]}}</h3>
<h3>{{array3[1]}}</h3>
<h3>{{array3[2]}}</h3>
<h3>{{object3.a1}}</h3>
<h3>{{object3.a2}}</h3>
</div>
728x90
'ETC > Vue.js' 카테고리의 다른 글
v-html / v-bind vue 코드에 html 코드 삽입 (0) | 2022.12.19 |
---|---|
beforeCreate / created Vue 생성주기 (0) | 2022.12.19 |
Vue 출력 오류 / Vue2 Vue3 default 문제 에러 {{}}가 안 먹을 때 (0) | 2022.12.18 |
Vue js 공부시작 (0) | 2022.12.18 |
Vue 기본 출력 (0) | 2022.12.09 |
댓글