Does anyone know why my Nuxt3 app won't load initial comments during SSR?
When I disable JavaScript in the browser, the comments array is empty, but if I enable JS, it will fill with the comments data. I thought Pinia works with SSR?
Comments.vue:
<template>
<section>
<CommentsList :comments="commentStore.comments" />
</section>
</template>
<script setup>
import { useCommentStore } from '@/stores/comment'
const route = useRoute()
const selected = ref('newest')
const commentStore = useCommentStore()
commentStore.sortByNewest(route.params.id)
</script>
stores/comment.ts:
import {defineStore} from 'pinia'
export const useCommentStore = defineStore('comment', {
state: () => {
return {
comments: []
}
},
actions: {
async sortByNewest(routeParamsId: String) {
const data = await $fetch(`/api/comments/newest/${routeParamsId}`)
this.comments = data
},
...snip..
}