飞豹客 · 课能看,资料也能带走
飞豹客前端开发 会员免费

尚硅谷Vue项目实战《尚医通》

尚医通是一个挂号就医类的后台管理系统,前端用 Vue 实现。它和常见的后台模板最大的区别在于:业务链条更长,涉及登录态、用户信息、实名认证、就诊人管理、订单状态等多个相互关联的模块。这门课就是围绕这个项目,把 Vue 在真实业务里的用法一段段拆开讲。 它解决的是"会写组件,但拼不成项目"的问题 很多

单课价¥29.90新品 上架
会员价 会员免费开通会员后本篇可直接下载套餐详情
914 人关注 更新于 2026-04-19 永久有效
发货

网盘链接 · 支付成功后自动发货

保障

永久有效 · 链接失效免费补发

客服

每日 9:00-21:00 在线客服 联系客服

会员可免费下载本篇月会员可按日额度下载(每篇扣 1 次)。

开通会员 ›
购买本课销量 0 · 永久有效
会员价 · 单课标价 ¥29.90

会员 A · 按档位折扣

永久免费可下
年免费可下
月免费可下
周免费可下

会员 B

VIP¥5.98低至
SVIP单买¥200 内可领

游客按标价购买,不享受上表折扣。

支付成功后自动发放网盘链接,链接失效可找客服免费补

正版保障 极速发货 售后无忧

尚医通是一个挂号就医类的后台管理系统,前端用 Vue 实现。它和常见的后台模板最大的区别在于:业务链条更长,涉及登录态、用户信息、实名认证、就诊人管理、订单状态等多个相互关联的模块。这门课就是围绕这个项目,把 Vue 在真实业务里的用法一段段拆开讲。

它解决的是"会写组件,但拼不成项目"的问题

很多人学完 Vue 基础后,能照着文档写出一个增删改查的小页面,但一遇到完整项目就卡住:路由怎么按权限切、登录态怎么存、表单校验规则写在哪里、多个模块之间的数据怎么传。这门课针对的正是这个断层。它不重新讲 Vue 语法,而是把语法放进具体场景里——比如登录模块,会讲到表单自定义校验规则怎么写、提交失败后怎么清空数据和校验结果;再比如微信扫码登录,会把整个跳转和回调流程讲清楚,而不是只丢一段代码。

适合的基础是:已经能看懂 Vue 单文件组件,知道 data、methods、路由和 axios 大概怎么用。完全没碰过 Vue 的人直接上会吃力,因为课程节奏是按项目推进的,不会停下来解释基础概念。有 Vue2 或 Vue3 基础、想补一个完整项目经验的,比较对路。

建议先看哪几块,学完能独立做什么

如果时间有限,优先看登录和用户信息这条线:登录表单校验、退出登录、登录态清理,再到实名认证模块获取用户信息。这条线把"前端如何管理用户身份"讲透了,是后面所有需要登录才能操作的模块的前提。接着看就诊人和订单状态相关的部分,这里会涉及接口联调、状态字段的处理、列表与详情的配合,属于业务系统里出现频率最高的写法。

学完之后,你能够独立完成的是一个中等复杂度的后台前端:从登录、鉴权、用户信息展示,到带校验的表单提交、列表数据渲染、状态判断和页面跳转。这些能力换到其他管理系统项目上同样能用,不是只对这个案例有效。

资料怎么配合练习

视频是按功能点切分的,单集时长不一,有的十几分钟讲一个小改动,有的接近二十分钟讲完整流程。建议不要一口气刷完,而是按模块看:看完一个模块,先自己照着实现一遍,再回头对照讲解检查差异。表单校验、状态清理这类细节,光看容易觉得"懂了",动手时才会发现漏了哪一步。

练习时尽量把接口请求和页面逻辑分开写,不要把所有代码堆在组件里。这个项目里模块之间有关联,一开始结构乱,后面改起来会很痛苦。另外,遇到讲接口返回字段的地方,建议自己打印一下数据再往下写,比直接抄代码更容易记住。

总体来说,这是一门偏实战、需要一定基础才能吃透的课。它的价值不在于教你新语法,而在于让你完整走一遍真实业务的前端实现过程。基础够、愿意动手敲的人,收获会比较实在。

课程目录

课程目录76 集
  • 📁 视频 视频资料.zip
  • [1.8 MB] 031_退出登录业务.mp4
  • [51.8 MB] 054_实名认证模块获取用户信息.mp4
  • [108.1 MB] 030_登录模块清空数据与表单校验结果.mp4
  • [91.1 MB] 029_登录模块表单自定义校验规则.mp4
  • [106.6 MB] 061_获取就诊人与订单状态API完成.mp4
  • [70.3 MB] 033_微信扫码登录完整流程解释.mp4
  • [193.8 MB] 032_微信扫码登录流程之一微信平台注册应用.mp4
  • [53.6 MB] 003_vite构建化工具初始化项目.mp4
  • [95.5 MB] 051_利用qrcode插件获取支付二维码.mp4
  • [85.5 MB] 071_路由鉴权完成.mp4
  • [95.3 MB] 015_首页根据关键字搜索医院.mp4
  • [201.3 MB] 018_pinia仓库存储医院详情数据【持续更新‖免费提供:Cunworknotess】.mp4
  • [172.7 MB] 019_完成预约挂号业务.mp4
  • [193.5 MB] 006_项目路由的搭建与滚动行为.mp4
  • [49.4 MB] 070_路由鉴权之进度条与网页标题的设置.mp4
  • [134.8 MB] 024_登录组件静态的搭建与场景的切换【公重号:CunWorkNotess】.mp4
  • [211.5 MB] 057_实名认证表单的自定义校验.mp4
  • [225.6 MB] 014_首页根据等级与地区筛选医院展示.mp4
  • [112.9 MB] 004_项目静态搭建与组件的拆分【公重号:CunWorkNotess】.mp4
  • [159.9 MB] 059_挂号订单模块API书写与ts数据类型的定义【持续更新‖免费提供:Cunworknotess】.mp4
  • [75.8 MB] 027_完成登录业务.mp4
  • [297.0 MB] 053_实名认证模块静态的搭建.mp4
  • [135.7 MB] 055_获取实名认证的证件类型的数据.mp4
  • [109.6 MB] 062_完成挂号订单模块.mp4
  • [120.5 MB] 023_完成login组件对话框的显示与隐藏.mp4
  • [132.9 MB] 016_首页常见科室静态搭建.mp4
  • [114.9 MB] 046_完成确定挂号业务.mp4
  • [144.3 MB] 028_登录模块表单校验.mp4
  • [82.2 MB] 056_收集表单数据完成实名认证业务.mp4
  • [240.3 MB] 038_预约挂号底部上下午医生结构的搭建.mp4
  • [138.9 MB] 069_完成删除就诊人信息业务.mp4
  • [86.7 MB] 047_完整订单详情静态的搭建.mp4
  • [156.4 MB] 050_完成支付对话框静态的搭建.mp4
  • [110.8 MB] 036_预约挂号的路由与静态的搭建.mp4
  • [169.1 MB] 020_完成医院详情模块业务.mp4
  • [126.4 MB] 040_预约挂号就诊人静态搭建-上.mp4
  • [162.6 MB] 045_完成会员中心路由.mp4
  • [150.6 MB] 048_获取订单详情的数据.mp4
  • [122.4 MB] 002_尚医通项目的简介.mp4
  • [54.9 MB] 022_完成医院科室业务.mp4
  • [287.8 MB] 008_首页等级与地区组件拆分与静态搭建.mp4
  • [150.3 MB] 063_就诊人管理模块展示全部的就诊人信息.mp4
  • [137.0 MB] 049_完成取消预约的业务.mp4
  • [108.0 MB] 005_底部组件拆分与静态搭建.mp4
  • [55.6 MB] 035_微信扫码登录业务完成.mp4
  • [147.9 MB] 007_首页静态搭建banner.mp4
  • [160.6 MB] 001_开篇介绍.mp4
  • [29.9 MB] 060_获取挂号订单的数据.mp4
  • [136.4 MB] 026_登录组件获取验证码倒计时业务.mp4
  • [151.3 MB] 041_预约挂号就诊人静态搭建-下.mp4
  • [61.6 MB] 011_展示已有医院的数据并分页展示.mp4
  • [291.5 MB] 065_获取证件类型与级联选择器展示地址.mp4
  • [183.0 MB] 068_完成更新已有就诊人的业务.mp4
  • [173.5 MB] 017_医院详情菜单与子路由.mp4
  • [172.5 MB] 064_完成添加与修改就诊人静态的的搭建.mp4
  • [157.2 MB] 010_axios二次封装与代理跨域的配置.mp4
  • [205.6 MB] 012_首页已有医院数据的ts类型定义.mp4
  • [97.7 MB] 052_完成订单微信支付的业务.mp4
  • [133.4 MB] 034_微信扫码登录之二维码嵌套在login组件内部.mp4
  • [281.3 MB] 067_完成添加就诊人的业务.mp4
  • [224.1 MB] 042_获取当前账号下就诊人信息且展示出来.mp4
  • [165.6 MB] 025_登录组件获取验证码.mp4
  • [204.7 MB] 039_预约挂号底部医生排班业务.mp4
  • [352.7 MB] 043_获取挂号医生的信息展示.mp4
  • [85.1 MB] 058_挂号订单模块静态的搭建.mp4
  • [82.6 MB] 009_首页医院组件的拆分与静态搭建.mp4
  • [195.5 MB] 013_首页医院等级与地区数据展示.mp4
  • [192.3 MB] 066_添加就诊人与更新就诊人API书写与ts类型定义.mp4
  • [86.5 MB] 044_确定就诊人业务完成.mp4
  • [111.9 MB] 037_展示预约挂号的数据.mp4
  • [215.6 MB] 021_完成预约通知业务.mp4
  • [111.8 MB] 📁 syt 📁 src 📁 pages 📁 index.vue [453.0 B] 📁 home 📁 search index.vue [1.9 KB] 📁 region index.vue [1.9 KB] 📁 carousel index.vue [342.0 B] 📁 level index.vue [2.0 KB] index.vue [3.7 KB] 📁 hospital 📁 register register_step2.vue [5.8 KB] 📁 close index.vue [495.0 B] 📁 notice index.vue [2.5 KB] 📁 search index.vue [495.0 B] index.vue [2.8 KB] 📁 user 📁 profile index.vue [138.0 B] 📁 order 📁 allOrder index.vue [4.7 KB] index.vue [423.0 B] 📁 certification index.vue [8.6 KB] 📁 feedback index.vue [139.0 B] 📁 patient index.vue [9.8 KB] index.vue [2.0 KB] 📁 store 📁 modules 📁 interface index.ts [464.0 B] user.ts [2.7 KB] hospitalDetail.ts [1.3 KB] index.ts [92.0 B] 📁 router index.ts [4.1 KB] 📁 api 📁 hospital index.ts [2.6 KB] type.ts [4.6 KB] 📁 home index.ts [1.1 KB] type.ts [2.4 KB] 📁 user index.ts [3.8 KB] type.ts [5.6 KB] 📁 style reset.scss [1.7 KB] 📁 components 📁 countdown index.vue [846.0 B] 📁 hospital_top index.vue [3.0 KB] 📁 hospital_bottom index.vue [794.0 B] 📁 visitor visitor.vue [3.8 KB] 📁 assets 📁 images 404.png [95.8 KB] web-banner-1.png [227.2 KB] 404_cloud.png [4.7 KB] logo.png [40.5 KB] code_login_wechat.png [6.2 KB] code_app.png [6.4 KB] auth_example.png [5.7 KB] 📁 utils user.ts [348.0 B] request.ts [2.3 KB] src文档.zip
  • [1.8 MB] permisstion.ts [1.5 KB] App.vue [689.0 B] vite-env.d.ts [38.0 B] main.ts [1.3 KB] syt必看.zip
  • [1.8 MB] package.json [628.0 B] _gitignore [253.0 B] tsconfig.json [801.0 B] README.md [1.5 KB] tsconfig.node.json [213.0 B] pnpm-lock.yaml [78.9 KB] vite.config.ts [471.0 B] index.html
  • [489.0 B] 商医通【持续更新‖免费提供:Cunworknotess】.md [1.8 KB] 适合人群 Vue爱好者 前端开发人员 项目实战需求者 学习收获 掌握Vue项目开发流程 提升实战能力 完成个人项目 祝您学习愉快! 学有所成,前程似锦!