الأسئلة الشائعة

التثبيت والإعداد

كيف أُثبّت @lh-ui/vue3؟

pnpm add @lh-ui/vue3

كيف أستورد المكوّنات؟

import LhUiPlus from '@lh-ui/vue3'
import '@lh-ui/vue3/dist/index.css'

app.use(LhUiPlus)

كيف أستورد ما أحتاجه فقط؟

import { LhButton, LhInput } from '@lh-ui/vue3'

تخصيص السمات

كيف أُخصّص لون السمة الأساسي؟

<LhConfigProvider :theme-vars="{ 'primary-color': '#e63946' }">
  <App />
</LhConfigProvider>

كيف أستخدم الوضع الداكن؟

import { useLhTheme } from '@lh-ui/vue3'
const { theme, toggleTheme } = useLhTheme()

يُعيد useLhTheme الكائن { theme, setTheme, toggleTheme }: يمثّل theme الوضع الحالي فاتحًا أم داكنًا (light / dark)، ويبدّله toggleTheme، بينما يضبطه setTheme مباشرة.

كيف أبدّل السمة المسبقة؟

استخدم useLhPresetTheme:

import { useLhPresetTheme } from '@lh-ui/vue3'
const { preset, setPreset, presets } = useLhPresetTheme()
setPreset('songhua') // التبديل إلى أخضر الصنوبر، مع الكتابة إلى :root والحفظ

يمكن تمرير applyToRoot: false لأخذ themeVars المُعاد فقط وتمريره إلى LhConfigProvider لتحديد النطاق محليًا. التفاصيل في السمات المسبقة.

التدويل

كيف أبدّل اللغة؟

<script setup lang="ts">
import { LhConfigProvider, enUS } from '@lh-ui/vue3'
</script>

<template>
  <LhConfigProvider :locale="enUS">
    <App />
  </LhConfigProvider>
</template>

تُستورد حزم اللغات بالاسم من مسار جذر الحزمة (zhCN / enUS).

كيف أضيف لغة جديدة؟

توجد الشيفرة المصدرية لحزم اللغات في الطبقة المشتركة @lh-ui/share (@lh-ui/share/locales/lang/)، ولم تعد مستضافة في هذا المستودع. لتسجيل لغة جديدة وقت التشغيل: lhlocale.use({ locale: 'xx-XX', messages })، حيث يُصدَّر lhlocale من @lh-ui/vue3.

استخدام المكوّنات

كيف يعمل التخطيط السريع عبر sx؟

<LhButton :sx="{ mt: 2, px: 4 }">زر</LhButton>

يدعم sx خصائص التخطيط فقط (الأبعاد w / h، والمسافات m* / p*، والمرن display / flex وغيرها)؛ أما الألوان فتحكُمها type أو متغيرات السمة.

كيف تُفعَّل خلفيات الأنماط الصينية؟

<LhConfigProvider :pattern-components="['button', 'dialog']">
  <LhButton bg-pattern="var(--lh-pattern-willow)">زر بنمط</LhButton>
</LhConfigProvider>

يقبل patternComponents أسماء المكوّنات بأحرف صغيرة ('button' / 'dialog' وغيرها، دون البادئة Lh)؛ وقيمة bg-pattern هي إمّا متغير CSS (مثل var(--lh-pattern-willow)) أو عنوان صورة. التفاصيل في نظام خلفيات الأنماط.

التطوير

كيف أساهم بالشيفرة؟

راجع دليل المساهمة.

التطوير بمساعدة الذكاء الاصطناعي

يستخدم المشروع وكلاء ذكاء اصطناعي للمساعدة في صيانة الشيفرة. ويقوم المستخدم يدويًا بتنفيذ جميع أوامر التحقق.