一个5年的web前端开源的uni-app快速开发模板,参考学习一同进步
建议uni-app使用时间达到1年以上的程序员来学习
- 下载下来,解压成文件夹
- 把项目包丢到HBuilder X里面
- HBuilder X要安装scss/sass编译插件
- 运行项目
QQ交流群(607391225) |
微信交流群 |
![QQ交流群](https://camo.githubusercontent.com/bfba0a28354eec5026222646c347cbce19ace603e32e35799cd60954023e7efb/687474703a2f2f716e2e6b656d65616e2e636e2f2f75706c6f61642f3230323030342f31342f31353836383330313737383437326b376f756269362e706e67) |
![微信交流群](https://camo.githubusercontent.com/163451387ca4c3e29a3ccbb9e1a7dbace2fbb7843f7c032971d73e31b7952837/687474703a2f2f382e3132392e3138362e33352f636f646557782f77656958696e5f67726f75705f636f64652e6a7067) |
微信打赏码 |
支付宝打赏码 |
![微信打赏二维码](https://camo.githubusercontent.com/452b2d682b8c3b68a42c08de668658d9447963c8e2cf2e4b5038299da0cf4790/687474703a2f2f716e2e6b656d65616e2e636e2f75706c6f61642f3230323030362f31372f3135393233383134373530323533716a61796f62702e706e67) |
![支付宝打赏二维码](https://camo.githubusercontent.com/80a0a1aa34cfeb019e7189b3dd612b729d8deb3e2f94a08a569908c049fd0a20/687474703a2f2f716e2e6b656d65616e2e636e2f75706c6f61642f3230323030362f31372f3135393233383135313533303461657a6a703768332e6a7067) |
- components/chat-emojis.nvue 表情组件(表情、收藏表情图、表情包)
- components/chat-message.nvue 消息显示及类型组件
- components/chat-preview.nvue 图片及视频预览组件
- components/chat-tabbar.nvue 底部操作组件(语音、输入框、发送)
- utils/emojis.js 表情数据
- utils/utils.js 工具
- chat.nvue 聊天主页面
- config.js 聊天配置页面及对接页面(所有的聊天对接都提取到这里了)
- 发 文本和表情
- 发 表情图片
- 发 图片
- 发 视频
- 发 语音
- 发 位置
- 发 文件
- 发 商品
- 禁言
- 单聊
- 群聊
- 发送图片、视频、文件先预渲染到页面(有上传进度),模仿微信上传图片
- 发送消息有发送中、发送失败(可点击重发)、发送成功
- 已读、未读(有样式、后端没实现)
- 瀑布流列表
- 防抖音滑动视频(带进度加载)
- 项目主题色介绍
- 头部导航示例
- 上拉加载,下拉刷新列表
- 地区选择
- 弹窗输入框
- 滑动操作
- 富文本编译
- 接口请求
- APP版本更新
- 支付
- 分享
- 小程序登录
- 公众号登录
- 登录拦截
- 获取当前位置
- 图片上传/文件上传
- 七牛云图片上传/文件上传
- 保存图片到相册
- webSocket封装介绍
- 公众号SDK
- APP权限判断和跳转到系统设置
- 常用工具
- 登录
- 注册
- 忘记密码
- 绑定手机号
- 协议
├── components // 组件
│ ├── common // 公共组件
│ └── module // 项目组件
├── config // 配置
│ ├── store // vuex商店
│ │ ├── modules // vuex分类
│ │ │ ├── common.js // vuex通用数据管理
│ │ │ └── user.js // vuex用户数据管理
│ │ └── index.js // vuex主文件
│ ├── baseUrl.js // 项目配置
│ ├── html5Utils.js // H5相关的功能(公众号支付、公众号登录)
│ ├── login.js // 小程序登录js代码部分和登录拦截器代码
│ ├── requestConfig.js // 接口请求配置
│ ├── socket.js // webSocket相关代码
│ └── utils.js // 项目相关工具(公众号分享、小程序分享数据处理、支付、获取经纬度、支付分配)
├── pages // 项目页面
├── plugins // 公共SDK(基本上不需要改)
│ ├── APPUpdate // APP版本更新
│ ├── request // 接口请求封装
│ ├── share // APP分享
│ ├── md5.js // md5加密
│ ├── permission.js // APP权限判断和打开手机系统设置
│ ├── utils.js // 工具(时间转换、APP和小程序获取经纬度代码)
│ └── wxJsSDK.js // 微信公众号SDK去权限获取页面
├── static // 公共文件
│ ├── demo // 本项目相关的图片(可删除)
│ ├── icon // 项目图标
│ ├── mp-h5 // H5第三方包(公众号JS-SDK)
│ ├── mp-weixin // 微信小程序第三方包
│ ├── share // 分享SDK的图标
│ └── zhouWei-navBar // 导航组件的图标
├── style
│ ├── common.scss // 公共样式文件
│ ├── input.scss // 公共表单样式
│ ├── mixin.scss // 样式配置文件
│ └── table.scss // 本项目相关的css(可删除)
├── unpackage // 项目编译后的文件
├── App.vue // 项目主界面
├── main.js // 程序入口文件,加载各种公共组件
├── manifest.json // uni-app项目类型及环境配置
├── pages.json // 项目路由及项目界面配置
├── README.md // 项目介绍文件
└── template.h5.html // 项目发布的时候使用的文件