2016-08-17 7 views
0

私は通常、すべてのコンポーネントがグローバルにコンパイルされ、お互いに兄弟としてコンパイルされていることを知っています。しかし、私はどのように親コンポーネントのプロパティを使用することができますか?たとえば、次のようにこの場合Vue.jsで内部コンポーネントを子としてコンパイルするにはどうすればよいですか?

Vue.component('parent',{ 
 
    template: '#parent', 
 
    props:['tab'] 
 
}); 
 

 
Vue.component('child',{ 
 
    template: '#child', 
 
    props:['scope'] 
 
}); 
 

 
new Vue({ 
 
    el: 'body', 
 
    data: function(){ 
 
    return { 
 
    tab: "global" 
 
    } 
 
    } 
 
});
<parent tab="parent"> 
 
    <child slot="child" :scope="tab"></child> 
 
</parent> 
 

 
<template id="parent"> 
 
    <h1>Parent</h1> 
 
    <slot name="child"></slot> 
 
</template> 
 
<template id="child"> 
 
    <p>Compiled in {{scope}}</p> 
 
</template> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"></script>

答えて

0

私は、子コンポーネントのローカル登録を使用すると思います。代わりに、それはグローバルローカルでそれを登録することができます作るのが好き:あなたが世界的にすべてのコンポーネントを登録する必要はありません

// extend and register in one step 
Vue.component('my-component', { 
    template: '<div>A custom component!</div>' 
}) 

// also works for local registration 
var Parent = Vue.extend({ 
    components: { 
    'my-component': { 
     template: '<div>A custom component!</div>' 
    } 
    } 
}) 

。あなたは、コンポーネントのインスタンスオプションを指定して、それを登録することによってのみ、別のコンポーネントの範囲で構成要素を利用可能にすることができます

http://vuejs.org/guide/components.html#Local-Registration

+1

Vue.component'はグローバルに登録する '、あなたがそれを指摘しなければなりません。 – gurghet

+0

彼は彼の元の質問で@ gurghet –

+0

私はそれが明確ではないと言います – gurghet

関連する問題