📱
📱
📱
📱

AI生成校园二手交易小程序:从需求到上线,新手也能独立接单

站长
2026年4月3日 · 阅读 1554 · 点赞 134 · 预计 4 分钟
分享:

AI生成校园二手交易小程序:从需求到上线,新手也能独立接单

大学城周边永远缺一个靠谱的二手平台——闲鱼太杂,表白墙太乱,微信群太难找。今天,我们用AI把它做出来,并且教会你如何把它变成副业收入。

本教程适合:完全没接触过小程序、但想靠技术接单的在校生/应届生。全程无命令行、无配置恐惧症。

---

🎯 第一步:定义最小可行需求(1分钟)

和客户(比如校学生会)确认核心功能:

  • 首页:轮播图 + 分类导航(教材/数码/生活)

  • 发布页:图片上传(模拟)、标题、价格、描述

  • 列表页:按分类筛选、关键词搜索

  • 详情页:图文展示 + 「联系卖家」按钮(跳转微信客服)
  • > ✅ 注意:暂不接入服务器(用本地storage模拟数据),确保当天可交付Demo。

    ---

    🧩 第二步:用Cursor生成「四页一结构」工程

  • 在 Cursor 新建文件 prompt-campusecondhand.md,输入:
  • 你是一个专注校园场景的小程序工程师。请生成一个「校园二手交易」小程序,满足:
  • 四个页面:index(首页)、list(商品列表)、detail(详情)、publish(发布)

  • 数据:所有商品信息存于 pages/index/index.js 的 mockData 数组(含 id, title, price, category, desc, imgPath)

  • 搜索:在 list 页面顶部加搜索框,实时过滤 mockData

  • 分类:顶部 tab 切换教材/数码/生活,切换时刷新列表

  • 发布页:表单含标题/价格/分类/描述,提交后 push 到 mockData 并 toast 提示

  • 所有 WXML/WXSS/JS 文件完整,带详细中文注释,不省略任何必需字段(如 page.json)

  • 全选 → 「Ask AI」→ 等待输出 → 按AI返回的目录结构(如 pages/list/list.wxml)逐一创建文件并粘贴。
  • 💡 进阶技巧:生成后,在 app.json 中检查 "pages": ["pages/index/index", ...] 是否完整,缺则手动补上。

    ---

    📱 第三步:真机调试 & 优化体验

  • 导入微信开发者工具(同上),编译首页 → 查看轮播图是否自动播放

  • 测试搜索:在 list 页输入「Mac」→ 应只显示含 Mac 的商品

  • 发布测试:填「二手MacBook Pro」→ 提交 → 返回首页 → 再进 list → 新商品已出现!
  • 常见问题解决:

  • 图片不显示?→ 把 mockData 中的 imgPath 改成 /images/mac.jpg,并在根目录新建 images 文件夹,放入任意1张jpg(命名 mac.jpg

  • 搜索无反应?→ 检查 list.jsonInput 事件绑定是否写为 bindinput="onSearch",函数名是否一致
  • ---

    💼 第四步:包装成接单产品(关键!)

    📄 交付物清单(直接发客户):


  • 小程序源码 ZIP(含全部文件)

  • 部署指南 PDF(3页:如何导入开发者工具、如何替换轮播图、如何修改联系方式)

  • 录屏演示 MP4(1分钟,展示搜索/发布/跳转全流程)
  • 💬 接单话术模板(发给学生会):


    > “学姐好!这是为您定制的校园二手小程序Demo,已实现发布、搜索、分类浏览功能,支持真机扫码体验。后续如需:①对接学校公众号菜单 ②增加在线聊天(用腾讯云IM)③部署到正式域名,均可按需升级。首单特惠:399元(含源码+1次远程部署指导)。”

    ---

    📈 副业延伸建议

  • 升级1:用AI生成「失物招领」模块(Prompt:「在现有小程序基础上,新增 pages/lost 页面,支持发布/查看失物信息,UI风格与首页统一」)

  • 升级2:把同一套代码,用AI提示词改为「社团招新报名小程序」,复用率达80%

  • 变现3:批量生成10所高校版本,打包成「高校小程序SaaS模板」,定价99元/校,挂小红书引流
  • 你交付的不是代码,而是「解决问题的能力」——而AI,是你最高效的杠杆。

    > ✅ 本文所有Prompt均经实测有效,可在 woshird.com/miniapp-prompts 获取完整提示词库。

    站长
    人人都是程序员,站长
    分享: