uni-app UI框架之ggui使用教程

gg-ui

GG-UI

多平台快速开发的UI框架

gg-ui是一款高性能，简洁、快速开发的ui组件；基于uniapp开发；全端兼容的基于flex布局的、无dom的ui库;目前为止，在小程序和混合app领域，高性能的框架；自动差量更新数据；可按需引入必要的扩展组件。

如果你想了解到更详细的文档，进入GG-UI官网查看

开始使用

1、安装 gg-ui


npm install @10yun/ggui-mobile -D

更新 gg-ui


npm update @10yun/ggui-mobile -D

2、引入

2.1 UniApp 开发中使用

在 pages.json 文件中加入以下匹配规则


"easycom": {

    "autoscan": true,

    "custom": {

        "^gg-(.*)": "@10yun/ggui-mobile/lib/gg-$1/gg-$1.vue"

        "^uni-(.*)": "@10yun/ggui-mobile/lib-uni/uni-$1/uni-$1.vue"//uni-ui相关组件 可不引用

    }

}

原文地址

2.2 内置uni-ui 文档

去除sass写法，可提升安装sass扩展所需要的较长时间，

2.3 常规CLI引用

在 script 中引用组件


import {ggInputText} from '@10yun/ggui-mobile'

//import ggInputText from '@10yun/ggui-mobile/lib/gg-input-text/gg-input-text.vue' // 也可使用此方式引入组件

export default {

    components: {ggInputText}

}

3、使用

在 template 中使用组件：


<gg-input-text label="昵称" />

空白项目一键安装

参开文档