I have the followig:

<div class="label">{{ item.data[0] }}</div>

and in the view I'm having the following:

{
  "id": 6,
  "firtname": "JHON ",
  "lastname": "SCALA",
  "fullname": "JHON  SCALA"
}

I justo want to show fullname

<div class="label">{{ item.data[0].fullname }}</div>

but I'm having this error

TypeError: Cannot read properties of undefined (reading 'fullname')

why????

CodePudding user response：

If the data is being fetched from database or any other async persistence, vue can't read item.data[0].fullname before its loaded. Try wrapping the div in a v-if like this:

<template v-if="item.data.length > 0">
  <div class="label">{{ item.data[0].fullname }}</div>
</template>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>