[Vue js] 컴포넌트 전역 vs 지역 등록 방법

오늘은 조금 헷갈릴 수 있는 컴포넌트의 전역, 지역 등록 방법에 대해 알아보도록 하겠습니다.

쉽게 설명하면 전역은 main js파일에서 컴포넌트를 등록한 것이고

지역은 사용하고자 하는 컴포넌트에 자식 컴포넌트를 등록하는 것입니다.

 

1. 전역 등록 방법

import BlackB from './components/BlackButton.vue'
import ModifyB from './components/ModifyButton.vue'
import GrayB from './components/GrayButton.vue'
import Plusb from './components/PlusButton.vue'

Vue.component('BlackB',BlackB)
Vue.component('ModifyB',ModifyB)
Vue.component('GrayB',GrayB)
Vue.component('Plusb',Plusb)

main js파일에 다음과 같이 전역 등록을 해주면

컴포넌트에서 사용할 때 등록할 필요가 없습니다.

등록하면 에러가 발생할 수 있으니 주의해주세요.

 

2. 지역 등록 방법

<template>
    <div>1<DetailT></DetailT></div>

</template>

<script>
import DetailT from '../components/DetailTamplate'
export default {
    components:{
        DetailT
    }
 }

사용하고자 하는 컴포넌트에 위와 같이 따로 등록할 수도 있습니다.

 

자주 사용하는 것은 전역으로

가끔 사용하는 것은 지역으로 등록하시기 바랍니다.