VUE 2: Dont use a component if an object is null

I am currently having a problem: I need to use a component only if the source information is available, else don't use it. I have tried with v-if but it appears to call the component anyway.

<div v-if="entry.banners">     <banner-selector        v-for="banner in entry.banners"        :key="banner.id"        :banner-id="banner.id"        :autotarget="banner.autotarget" :promo-selected="promoSelected"        @selectedItem="updateItemSelected($event)" />      <banner-base        v-for="banner in entry.banners"         :key="banner.id"         :slug-ficha="slugSelected"         :promo-selected="promoSelected"          :banner-id="banner.id" />  </div>  

This gives me an error because id doesn't exist when entry.banners is null. Also I am declaring banner-selector and banner-base, but they won't be used when the entry.banners object is null.

Any advice?

https://stackoverflow.com/questions/67342768/vue-2-dont-use-a-component-if-an-object-is-null May 01, 2021 at 12:04PM