Vueify

2016-04-21 7 views
5

पर Vuejs रिकर्सिव घटक Vuejs के आधार पर दस्तावेज़ीकरण उदाहरण मैं एक साधारण वृक्षदृश्य घटक करने की कोशिश कर रहा हूं जहां मैं बिना किसी इंटीक्शन के चार्ट का खाता दिखा सकता हूं (कोई ड्रैग और ड्रॉप नहीं ... वास्तव में सरल)।Vueify

मैंने फिडलजे पर एक उदाहरण दिया है लेकिन मेरे उदाहरण ठीक काम करता है ... मुझे नहीं पता कि मेरे ऐप पर मैं इसे क्यों काम नहीं कर सकता! मुझे नहीं पता कि यह कुछ Vueify मुद्दों है ... हो सकता है कि आप मेरी मदद कर सकते हैं!

मेरी कोड है:

OzChartTree.vue

<template> 

    <ul v-if="model.length"> 
     <li v-for="m in model" :class="{ 'is-group': m.children }"> 
      {{ m.name }} 
      <ul v-if="m.accounts"> 
       <li v-for="a in m.accounts"> 
        {{ a.name }} 
       </li> 
      </ul> 
      <oz-tree :model="m"></oz-tree> 
     </li> 
    </ul> 

</template> 

<script type="text/babel"> 

    import OzChartTree from './OzChartTree.vue' 

    export default { 

     components: { 
      OzTree: OzChartTree 
     }, 

     props: { 
      model: Array, 
     } 

    } 

</script> 

कहाँ मैं पहली बार ट्री दृश्य घटक

<oz-chart-tree :model="chart"></oz-chart-tree> 

समस्या फोन जब मैं फोन है ja.vue फ़ाइल पर पुनरावर्ती घटक।

यह ऊपर है जैसा कि मैंने निम्न त्रुटि मिला:

app.js:23536 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

लेकिन ठीक से OzTree रूप में पंजीकृत है कर रहा है! मैं समझ नहीं पा रहा हूँ!

किसी को कोई विचार है?

उत्तर

12
<script type="text/babel"> 

    import OzChartTree from './OzChartTree.vue' 

    export default { 
     name: 'oz-tree-chart', // this is what the Warning is talking about. 

     components: { 
      OzTree: OzChartTree 
     }, 

     props: { 
      model: Array, 
     } 

    } 

</script> 
+2

रिकर्सिव घटकों के लिए दस्तावेज़: http://vuejs.org/guide/components.html#Recursive-Component – Jeff