[Vuejs]-How to properly fetch a single product in from my api in Vue3

1👍

Since you’re using Composition API, you need to import and use the composable rather than this.$route.params.id.

This is how

<script setup>
import { useRoute } from 'vue-router'
const route = useRoute()

console.log('current param id', route.params.id)
</script>

as explained here.


Otherwise, since you have a /catalog/:id route, you should probably have a page where you fetch a specific one indeed.
Deciding if it should be in Pinia or fetched again comes down to the specificities of your app, how you want to handle your state, and other concerns. (also quite an opinion-based question)

I’d say, keep it easy initially and iterate on it afterward if some improvement is needed.

PS: I’ve noticed you’re fetching it from a JSON, I guess it’s for testing purposes and that you have a real API with your Django backend.

👤kissu

Leave a comment