# Démarrage rapide

# Import complet

import Vue from 'vue'
import LhUIVue2 from '@lh-ui/vue2'
import '@lh-ui/vue2/theme.css'

Vue.use(LhUIVue2)

# Import à la demande (recommandé, favorable au tree-shaking)

import Vue from 'vue'
import { LhButton, LhInput } from '@lh-ui/vue2'
import '@lh-ui/vue2/theme.css'
// Import individuel des styles de chaque composant (sans surcharge d'effets de bord, voir le bandeau de chaque page de composant)
import '@lh-ui/vue2/style/button'
import '@lh-ui/vue2/style/input'

Vue.use(LhButton)
Vue.use(LhInput)

# Configuration globale (facultative)

Enveloppez la racine de l'application avec LhConfigProvider afin de configurer de manière uniforme la taille, la langue et les variables de thème :

<template>
  <LhConfigProvider size="medium" locale="zh-CN" :theme-vars="{ 'primary-color': '#2B4C7C' }">
    <router-view />
  </LhConfigProvider>
</template>

# v-model et .sync

Sémantique Vue2 et conventions de cette bibliothèque :

  • Liaison bidirectionnelle des contrôles de formulaire : <LhInput v-model="text" /> (en interne model: { prop: 'modelValue', event: 'input' })
  • Affichage / masquage des boîtes de dialogue : <LhDialog :visible.sync="show" /> (.sync correspond à la convention d'événement update:xxx ; Dialog prend également en charge v-model)

# API impérative

import { t, setLocale } from '@lh-ui/vue2'
setLocale('en-US')
t('input.placeholder') // 'Please input'

Avertissement

Les précautions propres à Vue 2.7 et les restrictions complètes (réactivité des propriétés dynamiques, gestion des superpositions sans Teleport, etc.) figurent dans le fichier AGENTS.md du dépôt.

Copyright © 2024-2026 FengMo WenXue