amigo-lifestyle/src/pages/category2.vue

70 lines
1.6 KiB
Vue

<template>
<div class="container-fluid bg-white mx-auto mt-3 object-center p-0">
<h1 class="font-medium text-center leading-tight text-4xl p-4 text-black-600">New Arrivals - Category.vue</h1>
<hr class="">
<div class="grid gap-x-8 gap-y-4 grid-cols-5 mt-4 mb-4">
<div v-for="(item, index) in itemByCategory.data" class="">
<router-link :to="'/item/' + item.slug">
<div class="flex items-center justify-center ">
<img :src="'https://api8.siliconpin.com/assets/'+item.img" alt="{{ item.name }}"
class=" h-48 space-x-4 flex items-center justify-center" />
</div>
<h3 class="text-center text-1xl font-bold uppercase mt-3">{{ item.name }}</h3>
<p class="text-center">Qty - 2 </p>
<p class="text-center">Price - Rs. {{ item.price }} </p>
</router-link>
</div>
</div>
</div>
</template>
<script>
export default {
// data() {
// return {
// post: {},
// itemByCategory: {}
// }
// },
// mounted: function () {
// this.getItemByCategory()
// // console.log(this.$route.query.cat)
// // console.log(this.fruits)
// },
// methods: {
// getItemByCategory() {
// fetch('https://api8.siliconpin.com/items/ecom55?cat=' + this.$route.query.cat)
// // fetch('https://api7.siliconpin.com/items/ecom55')
// .then(response => response.json())
// .then(data => this.itemByCategory = data)
// console.log(this.itemByCategory)
// }
// }
}
</script>