v-bind

 

부모컴포넌트 App.vue

 

자식컴포넌트 HelloWorld.vue 

결과창

==> 결과가 제대로 출력되지 않는다

숫자계산, 객체의 키명 출력이 되지 않는다

숫자, 객체의 값을 전달할때는 매개변수 앞에 반드시 v-bind: 를 써줘야한다

v-bind: 를 생략해서 : 만 쓰기도 한다

 

결과창

 


default

 

매개변수 값이 전달되지 않았을 경우, 디폴트 값을 지정해줄 수 있다

->age매개변수를 부모컴포넌트로부터 전달받지 못했을 경우

자식컴포넌트에서 출력하면 age는 기본값으로 100으로 받아 출력된다

 


data

 

함수로 작성하여 데이터를 저장한 후 출력할 수 있다

 

결과창

 

+ Recent posts