# uniapp-Knight-app

**Repository Path**: zhang-wjj/uniapp-knight-app

## Basic Information

- **Project Name**: uniapp-Knight-app
- **Description**: uniapp社区交友，最详细的目录，代码易懂，最全面的注释
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: https://gitee.com/QJMOTOR600cc/uniapp-knight-app
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 2
- **Created**: 2023-04-14
- **Last Updated**: 2023-04-14

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

##  网易云社区交友app 
![请添加图片描述](./static/bgimg/WechatIMG262.jpeg)
![请添加图片描述](./static/bgimg/WechatIMG263.jpeg)
![请添加图片描述](./static/bgimg/WechatIMG264.jpeg)


### 1.各模块文件，放置
**1.common 文件 存放通用配置**

>  1. mpvue-citypic.. 文件目录存放 地址选择，直接复制来的
>  2. animate.css 存放动画，用于点赞，进入页面动画显现
>  3. common.css 通用样式文件
>  4. conflig.js 存放 接口前缀
>  5. free.css 文件 存放封装好的 css样式，页面使用添加class类名，减少css损耗
>  6. iconfont.css 阿里巴巴图标库
>  7. permission.js 放置图片上传组件，ios权限
>  8. request.js 文件 封装接口请求，get，post，promise异步请求
>  9. time.js 时间 日期，星座js处理函数
>  10. uni.css 文件 uniapp官方css文件
>  11. util.js 工具类js文件，重要！主要用于网络监听，版本热更新，第三方登录数据转换
>  
**2. components 存放页面调用较多的vue组件**
>  **common 目录 通用vue组件**
> 1. common-list 页面列表组件，调用最多的组件，有点赞，关注，进入空间功能
> 2. DividerLine 分割线组件
> 3. load-more 下拉更多组件
> 4. more-share 弹出层组件 ，(取消关注，分享功能，分享微信-QQ-新浪微博）也比较重要！
> 5. no-thing 兜底样式组件
> 6. other-login 第三方登录，（非常重要！！）但是微信小程序中微信登录，没搞定
> 7. upload-image 上传图片组件，在发布页面调用 （难度适中）

> **dynacmic 目录存放动态页面组件**
> 1.hot-cate 动态页 话题页面，热门分类组件，用于渲染所有分类
> 2. topic-list 话题页面 话题列表组件，可跳转话题详情页（路由传参）

> **friend-list 用于存放 好友列表组件**
>  1. 用于 互关，粉丝，关注 渲染好友样式（可在里面添加进入消息列表页，进行聊天）未写
>  
> **msg 目录 存放消息列表组件**
> 1. msg- list 消息列表页面，对方发送消息，接收消息组件（使用了时间戳转换工具）
> 
> **topic-detail 目录，存放话题详情页，顶部模块**
> 1. topic-info 用于渲染 话题详情 顶部展示模块 组件
> 
> **user-chat 目录 存放聊天气泡 模块组件**
> 1. chat-send 聊天气泡 底部发送按钮，输入框
> 2. user-chart 聊天气泡 对话框组件，实现俩人对聊，布局分布，时间戳转化
> 
**3. page 目录 存放APP所有页面**
**uiapp文件中 pages文件下 文件名和vue文件要对应**
> 1. about 存放 关于页面组件，（版本热更新）功能
> 2. add-input  发布页面（多图上传，选择话题，选择分类，仅自己，所有人可见，保存草稿）功能
> 3. dynamic 帖子详情页组件,(评论功能，时间戳转换，多层级评论列表，微信小程序分享功能，图片预览，回复评论，点击分享）
> 4. friend-list 目录 好友聊天列表
>  1.user-chat 聊天界面组件（俩人对聊）非常非常重要！！！！！！
>    2. friend-list 消息列表，左侧导航进入的，好友列表组件（互关，粉丝，关注人渲染，进入搜索页传参，搜索用户）
>5. history 浏览历史组件，（取出浏览记录，渲染）
>6. index 首页模块，更特么重要！！，关注，点赞，分享，动态判断 关注或进入空间 切换，选项卡，上拉加载）很多页面都是照这个来的
>7. message 消息列表页面（下拉刷新，进入页面清除底部tabbar数字角标）
>8. mine 个人中心页面 （登录未登录 ，样式切换，插入第三方登录）
>

> 9. search 搜索页面，（搜索历史，展示搜索后的数据，上拉加载，动态判断并修改顶部导航文字，判断用户或帖子，话题页进入展示相应内容）
> 10. topic-detail 话题列表 详情页 ，选项卡，列表功能
> 11. top-nav 话题分类页 (展示所有分类，动态添加id)
> 12. user-model 账号与设置目录，存放密码，邮箱，手机号绑定修改
> > 1. user-email 绑定邮箱页 
> > 2. user-feedback 意见与反馈页 没啥出众点
> > 3. user-password 修改密码页, （判断是否绑定手机号，修改密码，或者输入旧密码修改）
> > 4. user-phone 修改手机号 ，绑定手机号
> > 5. user-safe 账号与安全页面，绑定第三方登录，跳转修改手机，密码，邮箱页
>  13. user-set 用户设置页面 ，（清除缓存，退出登录）
>  14. user-space 个人空间页面 ，(加入移出黑名单，选项卡，跳转聊天页面，和次用户聊天）
>  15. user-userinfo 编辑资料 (修改头像，地区，性别各种功能，提交后台)
>  
> 16.  login 登录页面，（也特么挺麻烦，正则验证，验证码，账号密码切换，插入第三方登录）
>
### store 存放vuex数据管理
**webSocketTask 连接池，异步登录，上线，聊天转换，最难的了，看一个星期了，没看明白**
### app.vue 调用 检测app更新，网络监听，初始化登录，调用socketTask 聊天池，登录即上线
### page.json  配置文件 ，iconfont图标库转换，存放所有路由，找不到那个页面，就去这里面找