user9067673
user9067673

Reputation: 31

Vue.js - Get N element from array - Undefined

I have some issues with my Vue.JS code. I need to get 5-th element of my array and it's work fine but Vue display also a couple of errors

To get my data I used this code:

<div>
  <span>{{ items[4].name }}</span>
</div>

It's work fine (Vue display data) but I have also this error in console:

[Vue warn]: Error in render: "TypeError: _vm.items[4] is undefined"

found in

---> <GeneralComponent> at resources/js/components/GeneralComponent.vue
       <General> at resources/js/views/General.vue
         <App> at resources/js/views/App.vue
           <Root>


TypeError: "_vm.items[4] is undefined"

Upvotes: 1

Views: 589

Answers (2)

Aniefon Umanah
Aniefon Umanah

Reputation: 104

You are trying to get element before it rendered so I will say first check the length

<div v-if='items.lenght>0'>
   <span>{{ items[4].name }}</span>
</div>

Upvotes: 1

emcee22
emcee22

Reputation: 1889

I think that your array is populated after it is accessed in your dom, so you can try it like this:

{{ items[4] && items[4].name }}

Upvotes: 2

Related Questions