一款功能完整的宠物社区小程序,包含遛狗服务、宠物交友、商城购物、话题讨论、短视频等功能。
- 发布遛狗需求,上门喂猫需求
- 搜索附近互助需求
- 筛选条件(价格、距离、宠物类型、时间)
- 联系互助者的联系方式
- 评价和反馈系统
- 发布宠物信息
- 搜索附近宠物
- 按宠物类型、性别、年龄筛选
- 宠物主人交流
- 宠物配对推荐
- 宠物用品分类浏览
- 商品搜索和筛选
- 购物车功能
- 订单管理
- 收藏和点赞
- 发布宠物相关话题
- 评论和回复
- 点赞和分享
- 热门话题推荐
- 话题分类浏览
- 上传宠物视频
- 视频播放和分享
- 点赞和评论
- 推荐算法
- 视频分类
- 用户信息管理
- 我的宠物管理
- 发布内容管理
- 订单和收藏
- 设置和帮助
- 微信一键登录
- 用户信息授权
- 登录状态管理
- 自动登录验证
- 前端框架: 微信小程序原生开发
- UI组件: Vant Weapp
- 状态管理: 小程序原生数据绑定
- 网络请求: 微信小程序API
- 存储: 微信小程序本地存储
number_pets/
├── app.js # 小程序入口文件
├── app.json # 小程序配置文件
├── app.wxss # 全局样式文件
├── project.config.json # 项目配置文件
├── sitemap.json # 站点地图配置
├── package.json # 项目依赖配置
├── README.md # 项目说明文档
└── pages/ # 页面目录
├── login/ # 登录页面
├── index/ # 首页
├── walk-dog/ # 遛狗服务
├── pet-friends/ # 宠物交友
├── shop/ # 商城
├── topics/ # 话题讨论
├── videos/ # 短视频
├── profile/ # 个人中心
├── chat/ # 聊天
├── pet-detail/ # 宠物详情
├── order/ # 订单
└── post/ # 发布
└── utils/ # 工具函数
└── auth.js # 认证工具
- 克隆项目
git clone https://github.com/your-username/number_pets.git
cd number_pets- 安装依赖
npm install- 构建npm包
npm run build:npm-
在微信开发者工具中打开项目
-
配置AppID 在
project.config.json中修改appid为你的小程序AppID -
运行项目 在微信开发者工具中点击"编译"即可运行
注意: 如果遇到Vant组件找不到的错误,请:
- 确保已运行
npm run build:npm - 在微信开发者工具中点击"工具" -> "构建npm"
- 重新编译项目
在微信公众平台配置以下权限:
scope.userInfo: 获取用户信息scope.userLocation: 获取位置信息
需要实现以下接口:
POST /api/auth/wx-login: 微信登录接口GET /api/auth/validate-token: Token验证接口POST /api/user/update-profile: 更新用户信息接口
- 小程序启动时自动检查登录状态
- 未登录用户自动跳转到登录页
- 用户点击微信登录按钮
- 获取微信授权码并发送到后端
- 后端返回用户信息和Token
- 保存登录信息到本地存储
- 跳转到首页或指定页面
- 每个页面包含
.wxml、.js、.wxss三个文件 - 使用 Vant Weapp 组件库
- 遵循微信小程序开发规范
- 使用小程序原生数据绑定
- 全局数据存储在
app.js的globalData中 - 本地存储使用
wx.setStorageSync
- 封装了统一的请求方法
app.request() - 支持请求拦截和响应拦截
- 统一的错误处理
- 使用 rpx 单位适配不同屏幕
- 统一的颜色和间距规范
- 响应式设计
POST /api/auth/login- 用户登录GET /api/user/profile- 获取用户信息GET /api/user/stats- 获取用户统计
GET /api/walks/list- 获取遛狗列表POST /api/walks/create- 发布遛狗需求POST /api/walks/{id}/like- 点赞遛狗服务
GET /api/pets/friends- 获取宠物列表POST /api/pets/create- 发布宠物信息POST /api/pets/{id}/like- 点赞宠物
GET /api/products/list- 获取商品列表POST /api/cart/add- 添加到购物车GET /api/cart/count- 获取购物车数量
GET /api/topics/list- 获取话题列表POST /api/topics/create- 发布话题POST /api/topics/{id}/comment- 评论话题
GET /api/videos/list- 获取视频列表POST /api/videos/upload- 上传视频POST /api/videos/{id}/like- 点赞视频
- 在微信开发者工具中点击"上传"
- 填写版本号和项目备注
- 提交审核
- 审核通过后发布
- Fork 项目
- 创建功能分支
- 提交代码
- 创建 Pull Request
MIT License
- 初始版本发布
- 实现基础功能模块
- 完成UI设计和交互