Unterstützt dies die Composition API?

Ja. Sie können zwischen der Syntax 'Option Store' und der Syntax 'Setup Store' wechseln, die dasselbe Muster wie die Vue 3 Composition API verwendet.

Wird TypeScript unterstützt?

Ja. Der Generator erstellt standardmäßig vollständig typisierten TypeScript-Code, wodurch sichergestellt wird, dass Ihr Zustand und Ihre Aktionen von Autovervollständigung und Typüberprüfung profitieren.

Wie verwende ich den generierten Store?

Nachdem Sie den Code in Ihr Projekt kopiert haben, können Sie die Funktion `useStore` importieren und diese innerhalb des `setup`-Hooks oder des ` `-Blocks Ihrer Komponente aufrufen.

Werden meine Codedaten auf Ihrem Server gespeichert?

Nein. Die von Ihnen definierte Store-Struktur verbleibt vollständig in Ihrer Browserumgebung. Es werden keine Code- oder Architekturdaten extern übertragen oder gespeichert.

Formatierer & Code

Vue 3 + Pinia Store Generator

Typed Pinia stores with state, getters and actions.

Runs in your browser

Store name (camelCase)State (comma-separated key: default)Actions (comma-separated)

stores/user.ts

import { defineStore } from "pinia";
import { ref, computed } from "vue";

export const useUserStore = defineStore("user", () => {
  // state
  const id = ref('');
  const email = ref('');
  const isAuthed = ref(false);

  // actions
  async function login() {
    // TODO implement login
  }
  async function logout() {
    // TODO implement logout
  }

  return {
    id,
    email,
    isAuthed,
    login,
    logout,
  };
});

lines: 26chars: 431size: 431 B

live

Anmerkung der Redaktion

Understanding · State, derived state, mutations — one defineStore call.

Dieses ausführliche Kapitel ist derzeit nur auf Englisch verfügbar. Das Konvertierungstool oben funktioniert in Ihrer Sprache; der lange Erklärtext wurde noch nicht übersetzt.

Häufig gestellte Fragen

Quick answers.

›Does this support the Composition API?

Yes. You can toggle between the 'Option Store' syntax and the 'Setup Store' syntax, which uses the same pattern as the Vue 3 Composition API.

›Is TypeScript supported?

Yes. The generator produces fully typed TypeScript code by default, ensuring your state and actions benefit from autocompletion and type checking.

›How do I use the generated store?

After copying the code into your project, you can import the `useStore` function and call it inside your component's `setup` hook or `<script setup>` block.

›Is my code data stored on your server?

No. The store structure you define remains entirely within your browser environment. No code or architectural data is ever transmitted or saved externally.

Andere suchten auch nach

Verwandte Tools

More in this room.

Alle anzeigen in Formatierer & Code