ウェブサイト検索

TypeScript - ルート Vue コンポーネントで Pinia ストアを正しく使用する方法は?

私の main.ts:

import './assets/tailwind.css' import './assets/wordpress.css' import { createApp } from 'vue' import { createPinia } from 'pinia' import App from './App.vue' import router from './router' const app = createApp(App) app.use(createPinia()) app.use(router) app.mount('#app')

続きを読む →

vue.js - Pinia と TypeScript を使用する場合、Action を使って State を設定するにはどうすればよいですか?

私は user.ts という名前の Pinia + TypeScript ストアを持っており、それは次のようになっています:

import { User } from 'firebase/auth'; import { defineStore } from 'pinia'; export const useUserStore = defineStore('user', { state: () => ({ displayName: null,

続きを読む →

javascript - コンポーネント外で pinia を使用すると、no active pinia エラーが発生する

私は ViteSse テンプレートを使って構築した Vue.js 3 プロジェクトに取り組んでいます。setup コンポーネントの外で notificationStore という名前の Pinia ストアの 1 つを使いたいのですが、dev コマンドを実行すると getActivePinia called with no active Pinia. Did you forget to install Pinia というエラーが出ます。その挙動は非常に奇妙で、dev サーバーが読み込まれた後に useNotificationStore を追加するとエラーは発生せず正常に動作します。しかし、ts ファイル内に useNotificationStore が存在した状態で dev コマンドを実行すると、エラーが発生します。

続きを読む →

vue.js - Vue3 と TypeScript で Pinia ストアをプロップとして渡す

私はTypescript、Pinia、Vue3を使用しており、MenuButtonコンポーネントを持っています。このコンポーネントに、メニューの開閉状態や表示/非表示のアクションに使われるPiniaストアを渡せるようにしたいです。アプリ内にはいくつか異なるメニューがあるため、それらを渡せるようにしたいのです。そして、それらはすべて同じファクトリーを使ってストアを定義しています。これをTypescriptでうまく動かす方法を模索しています。

// nav.store.ts import { defineStore } from "p

続きを読む →

typescript - Piniaストアで定義された配列をどう使うか?

Userリソースを使用するためにストアを作成し、そのストアには役割の配列があります。私がやろうとしているのは、その配列の中から特定の役割を検索することです。配列の関数を使おうとしましたが、PropType<T[]>ではうまく機能しません。

import router from "@/router"; import axios from 'axios'; import { defineStore } from "pinia"; import { PropType } from "vue"; import { ApplicationConstants }

続きを読む →

typescript - ts(2769) PiniaストアのRefで$patchを使用すると、この呼び出しに一致するオーバーロードがありません

私はTypeScriptの問題で立ち往生しています。コード自体は実際に動作しているのですが、piniaの$patch関数を使おうとしたことでIDEエラーが出ています。

こちらが私の店です:

import { AuthenticationResult } from '@azure/msal-browser' import { defineStore } from 'pinia' import { ref } from 'vue' const useAuthStore = defineStore('auth', () => { const details = ref<AuthenticationResult>() return { details } }) export default useAuthStore

これは details プロパティを修正しようとする私のコードです:

const tokenResponse: AuthenticationRe

続きを読む →

TypeScript - Factoryパターンを使用するとPiniaの型が失われる

私のプロジェクトの必要のために、Piniaストアの作成をモジュール化するためのstoreFactoryを作成する必要があります。

ここでは特にパラメータを削除し、コード例を簡略化しました。

ファイルAにいるとき、storeFactoryの型は自動的に正しく取得されます

私がファイルBのとき、型は失われ、これだけが推測できる

StoreDefinition<"store_id", {} | _UnwrapAll<Pick<any, string | number>>, {} | Pick<...>, {} | Pick<...>

ファイルA

export function storeFactory() { const baseEntityComponents = {} const extensionComponents

続きを読む →

typescript - Nuxt Pinia: 非ECMAScriptモジュールから名前付きエクスポート 'computed' をインポートできません(デフォルトエクスポートのみ利用可能です)

私はTypeScriptでNuxt 2.15.8とVue 2.7.10でPiniaを使うことができません。いろいろな方法を試し、多くの依存関係をインストールしましたが、うまくいきませんでした。あまりにも多くのことを試したので、GitHub上のメインフォルダーを再作成しなければなりませんでした。これらの依存関係をインストールしました。

"@pinia/nuxt": "^0.4.9", "vue-server-renderer": "^2.7.10", "vue-template-compiler": "^2.7.10"

ビルドモジュールでPiniaを使おうとしたのですが、動かないので今は空です:

buildModules: [ // https://go.nuxtjs.dev/typescript '@nuxtjs/fontawesome',

続きを読む →

typescript - PiniaのuseStoreはanyを返します

私は Vue3 と TypeScript で Pinia を使用しています。ストアの型付けのさまざまな方法を使ってみましたが、ストアを any 以外の型にすることができませんでした。

実装は以下の通りです:

import { defineStore } from "pinia"; import type { DataT } from "@/types"; interface DataStore { data: DataT[]; } export const useDataStore = defineStore("dataStore", { state: (): DataStore => ({ data: [] as DataT[], }), });

このストアがコンポーネントにインポートされるどこでも、useDataStore() の返り値の型は any

続きを読む →

typescript - 各プロパティを手動で再作成せずに、インターフェースに基づいてpiniaの状態を定義する

私はSPAで状態管理(pinia)を実装しようとしています。私たちはTypeScriptを使用していて、状態の各プロパティを再度型定義することなく、インターフェースに基づいて状態を定義する方法があるかどうか疑問に思っています。基本的には、インターフェースに基づいた状態を定義し、それが正しい構造で初期化されるようにしたいということです。

defineStore を使って特定のインターフェース構造に従うステートを定義することはできます(これはすでに大き

続きを読む →