Как правильно настроить Pinia с Inertia.js SSR в AdonisJS 6? Получение «getActivePinia() был вызван, но активной Пинии нJavascript

Форум по Javascript
Ответить
Anonymous
 Как правильно настроить Pinia с Inertia.js SSR в AdonisJS 6? Получение «getActivePinia() был вызван, но активной Пинии н

Сообщение Anonymous »

Я создаю приложение, используя AdonisJS 6, Vue 3 и Inertia.js. Я пытаюсь интегрировать Pinia для управления состоянием, но сталкиваюсь с ошибкой:
Изображение

Я читаю в Интернете и вижу здесь другие проблемы, но я использую Pinia внутри компонента Vue (а не вне его!)
Мои текущие настройки

1. Установка:

Код: Выделить всё

npm i pinia pinia-plugin-persistedstate

2. Инерционная точка входа ([code]inertia/app.ts[/code])

Код: Выделить всё

/// 
/// 

import '../css/app.css'
import { createSSRApp, h } from 'vue'
import type { DefineComponent } from 'vue'
import { createInertiaApp } from '@inertiajs/vue3'
import { resolvePageComponent } from '@adonisjs/inertia/helpers'

import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

const appName = import.meta.env.VITE_APP_NAME || 'AdonisJS'

createInertiaApp({
progress: { color: '#5468FF' },

title: (title) => `${title} - ${appName}`,

resolve: (name) => {
return resolvePageComponent(
`../pages/${name}.vue`,
import.meta.glob('../pages/**/*.vue')
)
},

setup({ el, App, props, plugin }) {
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)
createSSRApp({ render: () => h(App, props) })
.use(plugin)
.use(pinia)
.mount(el)
},
})

3. Мой магазин пользователей:

Код: Выделить всё

import type { User } from '~/types'
import { defineStore } from 'pinia'

export const useUserStore = defineStore('user', {
state: () => ({
user: null as User | null,
token: null as string | null,
}),
getters: {
isAuthenticated: (state) => !!state.token && (state.user !== null || state.user !== undefined),
},
actions: {
setUser(user: User, token: string) {
this.user = user
this.token = token
},
clearUser() {
this.user = null
this.token = null
},
},
persist: true,
})

4. Пример компонента Vue (pages/Index.vue)

Код: Выделить всё

import { ref, computed, watch, onMounted } from 'vue'
...
import { useUserStore } from '~/store/user_store'

const userStore = useUserStore()

const props = defineProps()
...










Проблема и мой вопрос
Я думаю, что из официальной документации Pinia SSR здесь должно работать!
Изображение
Но почему-то это не работает! Есть мысли?

Подробнее здесь: https://stackoverflow.com/questions/798 ... ing-getact
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»