<p align="center"> <a href="https://www.vexipui.com/" target="_blank" rel="noopener noreferrer"> <img src="https://raw.githubusercontent.com/qmhc/vexip-ui/main/docs/public/logo.png" width="180" /> </a></p><h1 align="center">Vexip UI</h1><p align="center"> 高可定制化的属性值，全量的 TypeScript，性能应该还不错</p><p align="center"> 如果你用 Vexip UI 写了一些很酷的东西，你都可以告诉我！如果你可以并愿意贡献代码，非常欢迎！</p>项目文档地址：https://www.vexipui.com/项目仓库地址：https://github.com/qmhc/vexip-ui[Vexip UI](https://github.com/qmhc/vexip-ui) 是一款个人从零开始打造的（草根）组件库，没有大厂背景，砥砺前行~Vexip UI 提供了一系类开箱即用的组件，并且支持 **暗黑模式、CSS 变量、国际化、按需引入** 等等，SSR 也在来的路上。该组件库使用全新的 **组合式 Api** 编写，并尽可能采用 Vue 传统的方式设计和编写组件，全量的 **TypeScript**。每个组件几乎所有的 **属性默认值** 均可以通过注入配置快速修改（除了值和选项属性），轻松实现定制初始化。目前有 **70** 多个组件，一些你几乎看烂了的组件这里大多都有，或许也有一些与众不同的组件。> 目前组件库以及文档和配套设施都在仍在持续建设中，非常欢迎和希望有志同道合的小伙伴一起加入~如果觉得还 OK，能用 Vexip UI 来写点东西就是对我最大的鼓励和支持了，再能顺手点个 Star 🌟 就更好了~### 如何修改属性默认值如果你在应用中使用了非常多的某个组件，比如 Select，一般情况下它的 `size` 默认为 `'default'`，但你需要的都是 `'large'` 的，这时你会需要为每个 Select 组件都添加一个 `size="large"`：```vue<template> <Select size="large"></Select> <Select size="large"></Select> <Select size="large"></Select> <Select size="large"></Select></template>```Vexip UI 提供了在注册时通过配置直接修改某个组件的某个属性的能力：```tsimport { createApp } from 'vue'import { install } from 'vexip-ui'createApp(App) .use(install, { prop: { // 通过 default 还可以为所有具有 size 属性的组件的默认值都修改了 // defalut: { // size: 'large' // }, select: { size: 'large' } } }) .mount('#app')```这样，在直接使用 Select 组件时 `size` 的默认值就变成了 `'large'` 了。如果不希望全局修改，还可以借助 ConfigProvider 实现局部修改:```vue<template> <ConfigProvider :props="{ select: { size: 'large' } }"> <Select></Select> </ConfigProvider></template>```