최상위 요소(최상위 엘레멘트)

<template>

  <div >

  </div>

  <div >

  </div>

</template>

이렇게 최상위 요소 2개로 하지 마셈.

최상위 요소는 하나만 두셈.

 

template 자체는 그냥 그룹핑 하는 거지 html 태그가 아님.

그래서 실제로 랜더링 될 때는 저 template 벗겨지면서 template, vue에서는 다른 컴포넌트에서 불러올 때 저기에 막 속성도 주고 그랬는데, html에서는 저게 벗겨지면서 최상위 요소로 상속되는데,

최상위 요소가 여러개면 상속이 안됨.

 

근데, 아예 외부에서 지정해주는 속성이나 props나 받기 싫으면

export default{

  inheritAttrs : false

}

이렇게 inheritAttrs를 false로 해주면 상속받지 않음.

 

 

뭔가 상속받은 걸 쓰고 싶다

$attrs 객체로 쓰면 됨.

 

$attrs.class

$attrs.style

 

아니면

v-bind="$attrs"

하면 다 상속받음.

부모.. 라기보다는 template? 바깥껍질에 속성 준 것들 다 상속받음.