更新记录

1.0.5（2023-08-10） 下载此版本

• 1.0.5相对稳定的版本

平台兼容性

GE-Ui

项目介绍

GE-Ui是一个基于uni-app的ui项目。目前只针对H5、微信测试，其他平台慎用。

后续计划会推出微信小程序原生组件项目。

在线文档(https://geui.xyz)

GitHub(https://github.com/JameChou/geui)

最新Release 1.0.5

微信小程序、H5

如何使用

├── icon.css
├── ui.css
└── ui
    ├── components
    │   ├── ge-avatar
    │   ├── ge-avatar-group
    │   ├── ge-calendar
    │   ├── ge-card
    │   ├── ge-card-grid
    │   ├── ge-divider
    │   ├── ge-fav-card
    │   ├── ge-lottie
    │   ├── ge-nav-timetabs
    │   ├── ge-navbar
    │   ├── ge-navlist
    │   ├── ge-navtabs
    │   ├── ge-page
    │   ├── ge-rates
    │   ├── ge-select-list
    │   ├── ge-sheet
    │   ├── ge-small-card
    │   ├── ge-snackbar
    │   ├── ge-stepbar
    │   ├── ge-sticky
    │   ├── ge-switchseg
    │   ├── ge-tabbar
    │   ├── ge-timepicker
    │   ├── ge-title
    │   ├── ge-toast
    │   └── ge-waterfall
    ├── js
    │   └── store
    └── scss
        ├── animation
        │   ├── config
        │   │   └── mixins
        │   └── modules
        │       ├── fade
        │       ├── jello
        │       ├── pulse
        │       ├── scale
        │       └── wobble
        ├── basic
        ├── icons
        ├── theme
        └── vars

项目配置

icon.css是图标文件、ui.css是basic类(并不包含组件样式)。 如果你只想使用基础的样式就可以只引用ui.css或者icon.css。正常情况下css不会使用。

将ui目录copy到uni-app项目中。

在App.vue目录中将 scss引入。

<script>
    ....
</script>

<style lang="scss">
    /* ui目录 */
    @import "./ui/scss/ui.scss";
</style>

在根目录中的main.js中引入 GE-Ui的相关js文件。

// main.js
// 引入ge-ui的js
import ui from './ui';

// #ifndef VUE3
import Vue from 'vue'
Vue.config.productionTip = false
App.mpType = 'app'

// ...

使用组件有两种方式

1. 在pages.json配置使用easycom模式。
2. 在需要的页面内引用组件。

pages.json示例

"easycom": {
"ge-(.*)": "@/ui/components/ge-$1/ge-$1.vue"
}

反馈

联系作者: zhouxy.vortex@gmail.com / QQ: 252410130

或者在本项目上提issue