jh-weapp-demo

A new weapp project - 实现一些常用效果、封装通用组件和工具类

代码不定期更新

注：真实开发项目注意按需引用。例如：组件、工具类、app.json的引用，可通过代码依赖分析做优化。

小程序码

实现的一些效果

• ListView相关
• GridView相关
• eCharts分包导入，异步加载，多图表延时加载，中国地图效果
• 腾讯地图使用，定位、地图选点、标注点连线计算距离
• 上下拉刷新、分组吸顶ListView
• 答题功能
• excel导入导出
• 表格、表单录入
• 树结构数据展示
• 热门搜索和历史搜索框
• 侧滑筛选
• 顶部搜索+分栏+侧滑、底部tabbar
• custom-tabbar（动态设置、不闪屏）
• 波浪背景动画
• 登录页、功能页等UI页面

组件

• 自定义导航条，支持设置左侧文字图片，网络本地背景图，渐变背景色，左侧和标题slot，返回home主页，导航条加搜索框（jh-navbar、jh-custom-navbar、jh-capsule-navbar）
• 公农历通用时间选择器。支持同步切换，设置默认选中时间、设置最大最小时间(公历范围：1901/01/01 ~ 2100/12/31)，标题栏颜色（jh-lunar-picker）
• 年月日和年月日时分选择器（jh-ymd-time-picker）
• 月日周时分选择器（jh-time-picker）
• 字符串选择器（jh-string-picker）
• 中间输入弹框（jh-input-alert）
• 底部输入弹框（jh-input-picker）
• 自定义加载框（jh-loading-toast）
• 树形结构数据组件（jh-tree）
• 轮播图组件（jh-swiper-view）
• 左右时间切换（jh-time-switch）
• 下拉菜单（jh-dropdown-menu）
• 上下拉刷新组件（base-refresh-view、refresh）

工具类

• wx.request网络请求封装（httpUtils.js）
• API管理（apiCongfig.js）
• 用户管理云函数请求Promise封装(dataManager文件夹)
• AES、RSA加解密，SHA256、MD5加密，base64编码解码（encryptUtils.js）
• 时间格式转换、周岁计算（timeUtils.js）
• 公历农历转换、星座、属相、虚岁计算（lunarTimeUtils.js）
• 正则校验（checkUtils.js）
• 权限判断（authUtils.js）
• 安全随机数（commonUtils.js）
• 全局常量、变量（app.js、projectConfig.js）
• 公共样式（styles文件夹）
• 网络监听，设备类型和刘海屏判断（app.js）

注：

组件在jh-components文件夹
工具类在utils文件夹
网络请求和API管理在http文件夹
数据管理在dataManager文件夹
公共样式在styles文件夹

三方组件库

• WeUI

建议通过扩展库引入，不占用小程序包体积

• Vant

# 通过 npm 安装
npm i @vant/weapp -S --production

• ColorUI

需下载源码手动导入

• Wux

# 通过 npm 安装
npm i wux-weapp -S --production

预览

部分页面效果如下：