I have a problem working with arrays, So far am able to load data in view. My problem is now searching. If I add the array i get cannot read property ‘0’ of undefined. But when this line is not img :src=”http://stackoverflow.com/”images2/’+product.images(0).filename” included am able to get values.
This is the code:
<div v-for="product in Products.data" :key="product.id" class="p-2">
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">{{product.title}}</h5>
<div><img :src="https://stackoverflow.com/"images2/'+product.images(0).filename" width="200" height="200"></div>
<div class="itemv p-2"> Location:{{product.location}} </div>
<a class="btn btn-primary btn-sm" :href="http://stackoverflow.com/"/products/'+product.id">View</a>
</div>
</div>
The property
export default {
data(){
return {
id:"http://stackoverflow.com/",
Products:{
images:()
},
}
},
and my search function
created() {
Fire.$on('searching',() => {
let query = this.$parent.search;
axios.get('/productsearch/?q=' + query)
.then((data) => {
this.Products = data.data
})
.catch(() => {
})
})
this. loadProductData();
}