QuickGodUI ( UI for iView)
基于 iView 开发的 mpvue 组件库
快速配合 Quick.Core 接口使用
更新说明
-
1.2.8 更新了 badge html 标签
-
1.2.7 更新 quick.config.token.info 当前应用字段为 quick.config.token.app 更新 getTokenAuthBasic 方法输出为标准 JSON 字符串
-
1.2.6 开始适配 iView 4.0
开发文档
NPM 安装
npm i qkui-h5
预览
$ git clone https://www.npmjs.com/package/qkui-h5$ cd qkui$ yarn run example
开发调试
跨项目调试
直接复制 dist/打包后的文件到,替换项目下的 node_modules\qkui-h5
使用
html 引用
在页面上引入 js 和 css 文件即可开始使用:
<!-- import Vue.js --> <!-- import qkui-->
示例
qkui demo Welcome to quick
NPM 安装
并非全部组件样式,仅全局(字体、颜色等)样式和未被 Vue 组件化。
npm i qkui-h5
发布组件
npm loginnpm publish
全局引入
src/main.js 引用全局样式 import
:
;; // 全局 quick ui 与字体样式;;// 全局 quick ui 组件;//Vue.use(QuickUI);//可选配置参数Vue; // 生产模式VueconfigproductionTip = false; const app = el: "#app" router store ...App { // 页面基础字体 响应式缩放 let size = this$quickpage; console; };app; /** 全局动态调整基数 */// window.onload = function () {// quick.page.fontRem();// }; // window.onresize = function () {// quick.page.fontRem();// };
局部组件引入
小程序组件说明
部分组件因 mpvue 尚不支持的语法而无法实现,详细见不支持列表。
用微信 web 开发者工具打开 qkui
项目目录。
需要 Slot 支持暂未实现的组件,请使用全局样式,详细见文档。
组件状态
部分组件样式源自 iView 项目,并对其进行了必要重构以符合 weui-wxss。
打包说明
打包配置在 build/webpack.build.conf.js
复制 Less 样式输出
// 不打包字体样式 from: path to: path ignore: ".*" ;
不打包字体文件
// 不打包字体样式 from: path to: path ignore: ".*" ;
表单
-
List
(数据列表组件) -
Form
(数据编辑组件) -
Panel
(扩展查询选择组件) -
Table
(表格组件) -
Input
(定制输入组件) -
InputPrice
(定制输入金额组件)
基础组件
-
Badge
-
Icon
-
Article
-
Avatar
-
Tabs
-
Row
(需要 Slot 支持,暂使用样式) -
Col
(需要 Slot 支持,暂使用样式)
操作反馈
-
LoadingBar
-
Msg
-
NoticeBar
-
popup
(全局提示框)
导航相关
-
Tabs
(需要 Slot 支持,暂使用样式) -
Sidenav
-
Steps
窗口相关
-
win
-
tree
计划
- 支持 i18n
License
请自由地享受和参与开源