2017-10-02 1 views
0

Ich bin gerade mit Vue-Komponenten und lief in einen Fehler, den ich nicht zu verstehen scheinen, was falsch ist.Vue-Komponente undefinierte Eigenschaft bei der Verwendung als Kind für Steckplatz

Ich erstellte eine grundlegende Komponente, die fast identisch mit https://vuejs.org/v2/examples/grid-component.html ist, außer dass eine Datenstütze, ich habe einen Steckplatz innerhalb des Tags verwendet. Here is a gist of that full component

In einer übergeordneten Komponente versuche ich meine obige Tabelle Komponente und vue-paginate zu kombinieren, um eine paginierte Tabelle auszugeben.

<data-table> 
    <paginate 
     ref="paginator" 
     name="urls" 
     tag="tbody" 
     class="data-table-body" 
     :list="fUrls" 
     :per="100" 
    > 
     <template v-for="url in paginated('urls')"> 
      <conversion-row :url="url"></conversion-row> 
     </template> 
    </paginate> 
</data-table> 

Ich entfernte die Requisiten auf Datentabelle der Kürze halber.

Bei Verwendung der oben genannten. Ich bekomme einen Fehler von undefinierten URLs. Screen shot of Full Error Stack

Dies geschieht nur, wenn die Paginate-Komponente ein Kind meiner Komponente ist. Wenn ich meine Datentabelle-Komponente entferne, ist es in Ordnung, und ich sehe die Zeilen rendern. Ich weiß, dass ich etwas verpassen muss, damit das alles funktioniert. Durch das Lesen der Anleitung bekam ich den Eindruck, dass Komponenten im übergeordneten Bereich gerendert werden, die das Paginat zuerst rendern würde, und dann den Slot ersetzen. Dies scheint jedoch nicht der Fall zu sein.

Kann jemand einige Einblicke geben, warum dies nicht funktioniert und ein Beispiel für den richtigen Weg? bis zu meinen Eltern Ansicht

Dank

+0

Ich denke, dein Problem ist in '