找回密码
 立即注册
查看: 98|回复: 0

第一个项目-meta元圈

[复制链接]

2

主题

2

回帖

37

积分

新手上路

积分
37
发表于 2022-11-7 10:06:52 | 显示全部楼层 |阅读模式
本帖最后由 billkes 于 2022-11-7 10:10 编辑

meta元圈项目说明文档


设计目标
  • 项目用于发表发布动态点赞评论收藏,可以了解他人动态的同时了解当前新时代的新实事,改朝换代太快,要紧跟新时代潮流。
  • 不同于朋友圈,范围只限于微信好友,也不同于论坛,多数是在pc端,本项目结合两者,取其精华去其糟粕,开发于移动端与网页app设置小程序,本项目属于是移动端。



功能描述

  • 发布文章,发布动态,收看鲸闻
  • 用户登录,手机号验证码直接快捷登录
  • 用户详情丰富,帖子详情精华
  • 发表评论,回复评论,绿色言论自由
  • 搜索文章,搜索动态功能,分类方式搜索,满足需求
  • 点赞帖子,点赞用户,互点提示
  • 图片预览,图片放大缩小功能,高清不失真
  • 板块标签,社区标签,根据种类分类,不迷路



设计方案


  • 框架。使用vue-cli脚手架开发,实现页面切换不刷新页面,且不刷新页面局部更新数据,轻量级项目小,数据响应速度快,极致体验。
  • 数据。使用本地静态数据,dist目录下的data.json存放所有数据。
  • 图片与图标。 以精灵图为主,单图为辅,进行按钮,图形的渲染和填充。
  • 主要目录与文件(src目录下)。views目录,视图目录,内放置主页,兴趣页,搜索页,我的页,以及二级页等等的路由页;components目录,组件目录,内放置顶部标题导航栏和底部路由导航栏。



系统框架



  • 首页
  • 轮播图
  • 通告
  • 广告
  • 活动
  • 文章
  • 帖子
  • 分类横列表
  • 分文章
  • 分兴趣
  • 分动态
  • 分鲸闻
  • 分板块
  • 分标签
  • 帖子无限纵列表
  • 文章
  • 鲸闻
  • 动态
  • 兴趣页
  • 板块标签tab切换
  • 关注
  • 各种类型
  • 热门
  • 消息页
  • 我的页
  • 登录页



实现过程

  • 用户手机号验证登录直接注册登录
  • 去到首页,首页先往后推,优先实现顶部标签导航栏和底部路由导航栏。分别以组件形式分理出Home的路由
  • 实现首页轮播效果,左右loop,不顶边。中间稍大两边稍小,远近感,中间的轮播图近撑满横屏
  • 横屏滚动显示分类标签,点击跳转分类搜索页
  • 首页除了帖子基本信息展示即已完成,实现了无限帖子列表,向下刷新。
  • 兴趣页实现tabs切换,分左右,左边关注页,右边热门页,实现了切换效果,其余样式。首页有类似布局样式。
  • 消息页。较简洁简单布局,排版简单的入口页
  • 我的页。表层显示数据,与一些有规律摆放的按钮形成按钮组
  • 实现帖子详情。加载数据。功能晚会推到写完所有关于帖子的详情页,开始写功能,完成点赞评论,喜欢,回复,分享,转发,图片预览等等功能。
  • 实现首页单按钮功能。例如点击编辑跳转路由发布新帖子功能。点击搜索跳转搜索分类页。
  • 实现搜索分类页样式以及搜索和分类功能
  • 我的页。完善了二级三级详情路由跳转。与帖子一些操作关联起来。实现数据统一,完成多个细节功能。我的详情页内展示创作的tabs切换。
  • 测试项目。修复bug。处理数据相连细节。



使用到的技术
  • vue2
  • router3
  • axios
  • vant3
  • vue-cli



效果截图


  • 效果截图
  • 个人详情 => =>图片 * 14
  • 兴趣 => =>图片 * 9
  • 分类搜索 => =>图片 * 7
  • 发布 => =>图片 * 4
  • 帖子详情 => =>图片 * 16
  • 我的 => =>图片 * 3
  • 标签板块 => =>图片 * 4
  • 消息 => =>图片 * 1
  • 登录 => =>图片 * 6
  • 首页 => =>图片 * 8





本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

×
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|粤嵌技术交流空间

GMT+8, 2025-7-8 04:32 , Processed in 0.699235 second(s), 19 queries .

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表