前端代码
一个基于 uni-app 3.0 + Vue 3 开发的跨平台社交应用，支持小程序、H5 等多端运行。
- 登录页面 - 支持手机号/密码登录，带有表单验证
- 注册页面 - 完整的注册流程，包含：
- 用户名输入
- 手机号验证（11位中国大陆手机号格式）
- 密码强度校验（至少6位，仅支持大小写字母和数字）
- 确认密码验证
- 用户协议勾选
- 首页 - 内容流展示
- 详情页 - 帖子详情查看
- 图片轮播展示
- 点赞功能（带心跳动画效果）
- 评论列表
- 评论发布
- 发布页 - 内容发布功能
- 个人主页 - 用户信息展示
- 设置页面 - 应用设置
- 私信功能 - 消息通知
- 框架: uni-app 3.0.0
- 前端: Vue 3.4.21
- 构建工具: Vite 5.2.8
- 语言: JavaScript
- 样式: CSS (rpx 响应式单位)
├── pages/
│ ├── login/ # 登录页
│ ├── register/ # 注册页
│ ├── home/ # 首页
│ ├── detail/ # 详情页
│ ├── profile/ # 个人中心
│ ├── publish/ # 发布页
│ ├── message/ # 私信页
│ └── settings/ # 设置页
├── App.vue # 应用入口
├── main.js # 主入口文件
├── pages.json # 页面配置
├── manifest.json # 应用配置
└── package.json # 依赖配置
- Node.js 14+
- HBuilderX (推荐) 或 VS Code + uni-app 插件
npm install
npm run dev:h5
npm run dev:mp-weixin
npm run dev:mp-alipay # 支付宝小程序
npm run dev:mp-baidu # 百度小程序
npm run dev:mp-qq # QQ小程序
npm run dev:mp-toutiao # 字节跳动小程序
npm run build:h5 # H5打包
npm run build:mp-weixin # 微信小程序打包
- 渐变背景设计
- 实时表单验证
- 友好的错误提示
- 图片轮播
- 点赞动画效果（空心❤️ → 红心❤️）
- 评论交互
- 配置了 8 个主要页面
- 底部 TabBar 包含首页和个人中心
- 全局导航栏设置为自定义样式
需要补充的配置项：
name: 应用名称appid: 应用ID（DCloud appid）description: 应用描述mp-weixin.appid: 微信小程序 AppID
35/F,Tencent Building,Kejizhongyi Avenue,Nanshan District,Shenzhen
