登录前预览 — 3种架构方案

混合型内容,决定了放「什么」,现在选「怎么放」

A. 独立欢迎页 + 登录入口

新增一个独立的 landing.vue 作为小程序第一屏

Landing Page
🌟 溪艾福
家庭主动健康管理平台
🔥心·火🌿行·木💧富·水
开始使用 →
已有账号?登录

优点

  • 内容丰富,展示空间大
  • 引导性强,适合品牌传达
  • 不干扰现有登录逻辑

缺点

  • 多一次页面跳转
  • 需管理新页面

B. 登录页增强(内容嵌入登录页)

改造现有 login.vue,上方内容展示 + 下方登录表单

登录页增强版
🏆 任务积分
五行沙盘
👨‍👩‍👧 双角色
手机号登录
先看看 →

优点

  • 无新增页面跳转
  • 用户可直接看到内容

缺点

  • 内容空间有限
  • 登录与浏览体验混杂
  • 长页面在小屏上体验不佳

C. TabBar 解除登录限制

允许未登录用户访问「发现」「商城」Tab,操作时再提示登录

TabBar 模式
首页 发现 商城 我的
📖 精选内容
培养孩子专注力的5个方法
2026-06-01
DAN测评:了解孩子的天赋
2026-05-28
🔒 登录解锁全部功能

优点

  • 用户体验最流畅
  • TabBar内容直接可看
  • 登录是后台的事,前台体验完整

缺点

  • 需改造路由守卫
  • 「发现」内容需提前准备
  • API层需区分登录态

💡 我的推荐:方案 C 为主 + 方案 A 为辅

方案 C 解除 TabBar 限制是最自然的体验——用户打开小程序就能看到「发现」页的精选内容和「商城」的服务列表。 同时在 login 页顶部做一个精简的产品亮点展示(方案 A 的精简版),让登录页本身也有吸引力。

点击卡片选择你倾向的方案,然后告诉我你的想法。