LoginSignup
11
10

More than 5 years have passed since last update.

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

Posted at

コンポーネント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
    }
});
11
10
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
10