هل هذا يدعم واجهة برمجة تطبيقات التركيب (Composition API)؟

نعم. يمكنك التبديل بين بناء جملة 'Option Store' وبناء جملة 'Setup Store'، الذي يستخدم نفس النمط مثل Vue 3 Composition API.

هل TypeScript مدعوم؟

نعم. يقوم المولد بإنتاج كود TypeScript مُكتمل كتابةً بشكل افتراضي، مما يضمن استفادة حالتك وإجراءاتك من الإكمال التلقائي والتحقق من النوع.

كيف أستخدم المتجر الذي تم إنشاؤه؟

بعد نسخ الكود إلى مشروعك، يمكنك استيراد وظيفة `useStore` واستدعائها داخل `setup` hook الخاص بمكونك أو كتلة ` `.

هل بيانات الكود الخاصة بي مخزنة على خادمنا؟

لا. يظل هيكل المتجر الذي تحدده بالكامل ضمن بيئة متصفحك. لا يتم إرسال أو حفظ أي كود أو بيانات معمارية خارجيًا على الإطلاق.

المنسقات والكود

منشئ Vue 3 + Pinia Store

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

ملاحظة المحرر

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

هذا الفصل المعمّق متاح حاليًا باللغة الإنجليزية فقط. أداة التحويل أعلاه تعمل بلغتك؛ أما المقال التفصيلي الطويل فلم تتم ترجمته بعد.

الأسئلة المتكررة

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.

يبحث الأشخاص أيضًا عن

أدوات ذات صلة

More in this room.

شاهد الكل في المنسقات والكود