1 Star 1 Fork 0

MINT / MintUI

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README

MintUI

Mint UI 是一款基于 Vue 3 和 TypeScript 的 UI 组件库。

这款组件库其实是我为了总结自己的技术经验而写的,全程亲手编写,尽量不采用第三方库,包括你现在看到的这个官网也几乎都是我自己写的。

所以如果强烈不建议你将此 UI 库用于生产环境。但如果你是抱着看源代码的目的来的,那么这个库还是值得一看的。源代码放在了 Gitee历史提交信息非常规范,你可以按提交的顺序逐个查看;你也可以直接查看每个组件的源代码和示例,运行方法见 README.md。

介绍

  • 基于Vue3
    • 使用了Vue3 Composition API
  • 基于Typescript
    • 源代码采用Typescript书写(非常严格)
  • 代码易读
    • 每个组件的源代码都极其简洁

安装教程

打开终端运行下列命令:

npm install mint-ui-1

yarn add mint-ui-1

使用说明

请先安装本组件库。

然后在你的代码中写入下面的代码

Vue 单文件组件

代码示例:

<template>
  <div>
      <Button @click="open">按钮</Button>
  <hr />
  <Switch v-model:value="switchValue" />
  <hr />
  <Tabs v-model:selected="tabSelected">
    <Tab title="导航1">吃饭</Tab>
    <Tab title="导航2">睡觉</Tab>
    <Tab title="导航3">打豆豆</Tab>
  </Tabs>
  </div>
</template>

<script>
import { Button, Tabs, Tab, Switch, Dialog, openDialog } from "mint-ui-1";
import "mint-ui-1/dist/lib/mint.css";
export default {
  components: { Button, Tabs, Switch, Dialog },
   data() {
    return {
      switchValue: false,
      tabSelected: "导航1",
    };
  },
  methods: {
    open() {
      openDialog({
        title: "标题",
        content: "内容",
      });
    },
  },
}
</script>

就可以使用我提供的组件了。

参与贡献

  1. Fork 本仓库
  2. 新建 Feat_xxx 分支
  3. 提交代码
  4. 新建 Pull Request

空文件

简介

基于Vue3的UI组件库,目前包含四个组件,完善中... 展开 收起
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
TypeScript
1
https://gitee.com/boheweb/mint-ui.git
git@gitee.com:boheweb/mint-ui.git
boheweb
mint-ui
MintUI
master

搜索帮助

53164aa7 5694891 3bd8fe86 5694891