[Vuejs]-Vue – Unable to use variable in template

by

1👍

✅

The problem is that you try to access props variable directly from your template. To solve this, initalize a state variable (under data {}) Within props value as default like you did With picsNeW.
another remark, avoid to use “this” from template, you should access directly datas form its name. Use default value in your props, this is recommended 🙂

👤balzacLeGeek

2👍

The line {{ this.galCode }}{{ photo.filename }} should be {{ galCode }}{{ photo.filename }}. Your problem is the this you added

👤Emmanuel Ogoma

1👍

First you should define Default value as :

  props: {
    name: {
      type: String,
      default: 'default'
    },
    ...
    galCode: {
      type: Number,
      default: 0
    },
  },

Second be sure you receive desired data, specially in nested object you should check the object defined to prevent receive undefined property error, like use v-if : 

<header>
    <template v-if="galCode">{{ galCode }}</template>    // can use v-else here too print default value
    <template v-if="photo.filename"> {{ photo.filename }}</template>

</header>
👤Mohsen

Leave a comment