# Быстрый старт

# Полное подключение

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

Vue.use(LhUIVue2)

# Выборочное подключение (рекомендуется, полезно для tree-shaking)

import Vue from 'vue'
import { LhButton, LhInput } from '@lh-ui/vue2'
import '@lh-ui/vue2/theme.css'
// Стиль каждого компонента подключается отдельно (без накладных расходов от побочных эффектов,
// см. описание в начале страницы компонента)
import '@lh-ui/vue2/style/button'
import '@lh-ui/vue2/style/input'

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

# Глобальная конфигурация (необязательно)

Оберните корень приложения в LhConfigProvider, чтобы задать размер, язык и переменные темы:

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

# v-model и .sync

Семантика Vue2 и соглашения библиотеки:

  • Двусторонняя привязка элемента формы: <LhInput v-model="text" /> (внутри model: { prop: 'modelValue', event: 'input' })
  • Видимость диалога: <LhDialog :visible.sync="show" /> (.sync — соглашение о событии update:xxx; Dialog также поддерживает v-model)

# Императивный API

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

Предупреждение

Замечания по окружению Vue 2.7 и полный список ограничений (реактивность динамических свойств, слой всплывающих окон без Teleport и т. д.) см. в AGENTS.md репозитория.

Copyright © 2024-2026 FengMo WenXue