[Vuejs]-Vue component undefined property when used as child for slot

by

0👍

✅

I ended up rearranging this and using scoped slots, to hoist my paginated data back up to my parent view.

In my DataTable (child) component I have

...
<paginate
    v-if="! isLoading"
    ref="paginator"
    name="data"
    tag="tbody"
    class="data-table-body"
    :list="data"
    :per="100"
>
    <slot :data="paginated('data')"></slot>
</paginate>
...

then in my parent template

<data-table :data="src">
    <template scope="dt">
        <conversion-row v-for="url in dt.data" :url="url"></conversion-row>
    </template>
</data-table>

This lets me pass in the full data src but loop through the paginated rows in my parent providing a custom body.

This might not be the best/most efficient way to do it but it works for my use case. If anyone has recommendations for improvement i’d love to hear.

Leave a comment