vue.js

Vue.jsでローカルのコンポーネントの中で別のコンポーネント(子コンポーネント)を使う

コンポーネントAの中でコンポーネントBを使いたい

// コンポーネントA
<template>
    <component-b></component-b>
</template>
<script>
    // コンポーネントBをインポート
    import ComponentB from './ComponentB.vue';

    export default {
        // componentsでコンポーネントBを登録(ここで登録してないと、エラーになる)
        components: {
            'component-b': ComponentB
        },
    }
</script>

ちなみに、
こんな感じで定義してもコンポーネントBはコンポーネントAの中では認識されなかった。

import Vue from 'vue'
import ComponentA from './ComponentA.vue';
import ComponentB from './ComponentB.vue';

let App = new Vue({
    el: '#app',
    components: {
        ComponentA,
        ComponentB
    }
});