Cannot read property 'text' of null

[robbinjohansson]

Hi, Great work on this component! 👍

Today I encountered an issue though, suddenly my feed stopped working (been working just fine until today, I havent changed or updated anything - it just broke all of a sudden).

I did some testing and it seems that {{ props.feed.caption.text }} is the issue, not sure what's causing it to break however. Any ideas?

Template:

<template>
    <vue-instagram token="token" username="user" :count="3">
        <template slot="feeds" slot-scope="props">
            <article class="media">
                <!-- Not working -->
                {{ props.feed.caption.text }}
            </article>
        </template>
        <template slot="error" slot-scope="props">
            <div class="fancy-alert"> {{ props.error.error_message }} </div>
        </template>
    </vue-instagram>
</template>
<script>
import VueInstagram from 'vue-instagram'
export default {
    components: {
        VueInstagram
    }
}
</script>

Error: This is my console error returned when trying to fetch the caption text: TypeError: Cannot read property 'text' of null

[robbinjohansson]

Solved it, looks like the one of the posts from the instagram feed I'm using had an empty caption which is what broke the component.

Solution, wrap with v-if:

<article class="media" v-if="props.feed.caption">
    {{ props.feed.caption.text }}
</article>