Answer the question
In order to leave comments, you need to log in
How to get key from json object received via ajax inside component with v-for?
There is a component inside html with conditional rendering
<cart-item v-for="(product, key, index) in products" :product="product" :key="index">
</cart-item>
Vue.component('cart-item', {
props: ['product'],
template:'<div>{{ product }} {{ key }}</div>'
});
var app = new Vue({
el: '#app',
data: function () {
return {
products: [];
};
},
beforeCreate: function () {
var self = this;
axios.get('http://localhost:3000/cart')
.then(function (response) {
self.products = response.data.products;
})
.catch(function (error) {
console.log(error);
});
}
});
{
"products":{
"0968757":{
"imageUrl":"//54754.jpg",
"name":"rthrthtr",
},
"34364326":{
"imageUrl":"//657457.jpg",
"name":"rthrthtr",
}
}
}
Answer the question
In order to leave comments, you need to log in
How to get keys from products inside a component? In theory, they seem to need to be declared in props
Vue.component('cart-item', {
props: ['product', 'productKey'],
template:'<div>{{ product }} {{ productKey }}</div>'
});
<cart-item
v-for="(product, key) in products"
:product="product"
:product-key="key"
:key="key"
></cart-item>
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question