Name Last Update
..
components Loading commit data...
libs Loading commit data...
LICENSE Loading commit data...
README.md Loading commit data...
changelog.md Loading commit data...
index.js Loading commit data...
index.scss Loading commit data...
package.json Loading commit data...
theme.scss Loading commit data...

logo

uView

多平台快速开发的UI框架

说明

uView UI,是uni-app生态优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水

特性

  • 兼容安卓,iOS,微信小程序,H5,QQ小程序,百度小程序,支付宝小程序,头条小程序
  • 60+精选组件,功能丰富,多端兼容,让您快速集成,开箱即用
  • 众多贴心的JS利器,让您飞镖在手,召之即来,百步穿杨
  • 众多的常用页面和布局,让您专注逻辑,事半功倍
  • 详尽的文档支持,现代化的演示效果
  • 按需引入,精简打包体积

安装

# npm方式安装,插件市场导入无需执行此命令
npm i uview-ui

快速上手

  1. main.js引入uView库

    // main.js
    import uView from 'uview-ui';
    Vue.use(uView);
  2. App.vue引入基础样式(注意style标签需声明scss属性支持)

    /* App.vue */
    <style lang="scss">
    @import "uview-ui/index.scss";
    </style>
  3. uni.scss引入全局scss变量文件

    /* uni.scss */
    @import "uview-ui/theme.scss";
  4. pages.json配置easycom规则(按需引入)

// pages.json
{
    "easycom": {
        // npm安装的方式不需要前面的"@/",下载安装的方式需要"@/"
        // npm安装方式
        "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
        // 下载安装方式
        // "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
    },
    // 此为本身已有的内容
    "pages": [
        // ......
    ]
}

请通过快速上手了解更详细的内容

使用方法

配置easycom规则后,自动按需引入,无需import组件,直接引用即可。

<template>
    <u-button text="按钮"></u-button>
</template>

请通过快速上手了解更详细的内容

链接

预览

您可以通过微信扫码,查看最佳的演示效果。

捐赠uView的研发

uView文档和源码全部开源免费,如果您认为uView帮到了您的开发工作,您可以捐赠uView的研发工作,捐赠无门槛,哪怕是一杯可乐也好(相信这比打赏主播更有意义)。

版权信息

uView遵循MIT开源协议,意味着您无需支付任何费用,也无需授权,即可将uView应用到您的产品中。