基本信息
文件名称:Vue.js前端框架项目实战(微课版)教案-任务书 任务2.2 开发个人中心页面.docx
文件大小:1.24 MB
总页数:2 页
更新时间:2025-12-19
总字数:约小于1千字
文档摘要
任务2.2开发个人中心页面
通过优化“HTML版技术社区网站”的首页和个人中心页面,掌握条件渲染指令的灵活运用,实现复杂页面逻辑和动态内容展示。具体任务要求如下。
1.完善首页登录功能
实现首页头部的登录状态检测与跳转逻辑,实现以下逻辑:在未登录状态下,显示“登录”按钮,如图2-17所示,在单击“登录”后跳转至登录页面;在已登录状态下,显示用户头像和用户名,如图2-18所示,在单击用户头像或用户名后跳转至个人中心页面。
图2-17未登录状态
图2-18已登录状态
2.开发个人中心页面
复制首页头部至个人中心页面,并设置为用户已登录状态。
实现左侧菜单栏,包含个人主页、个人资料、账号