# 企鹅的软件（uni-app学习项目）

**Repository Path**: penguink3/pen-uni-app

## Basic Information

- **Project Name**: 企鹅的软件（uni-app学习项目）
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-04-17
- **Last Updated**: 2022-05-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 项目环境

- Hbuilder + vue + 微信小程序 + [uni-app](https://gitee.com/penguink3/study-notes/blob/master/%E5%89%8D%E7%AB%AF/uni-app/uni-app.md)

# 启动项目

1. Hbuilder启动即可

2. unpakage中有dist文件夹

3. unpakage/release/apk中有安卓手机端APP安装包

- 页面文件都在pages文件夹中

# 项目结构
## 页面逻辑
---
<div align="center">
    <img src="ReadmeImg/1.png"/>
</div>

---

## 文件作用和知识点
1. login.vue
    - 只是做了一个登陆页面的框架
    - 展示了第三方登陆的前端制作，实现了模块居中和横向排布
    - uni.setStorage存储了登陆状态，使用uni.getStorageSync可获取，这相当于本地缓存，可以用来存session或者cookie

2. home.vue
    - uni-list列表布局
    - uni-notice-bar消息提示栏
    - 回到顶部和触底刷新设计方案
    - 使用uni.getStorageSync获取登陆状态
    - uni.request网络请求
    - /* #ifdef H5 */ 宏编程条件编译，平台区别编程方案
    - uni.navigateTo页面跳转，传参

3. heros.vue
    - 双scroll-view形成分类列表栏
    - uni.getSystemInfoSync()获取窗口信息（宽高）
    - uni-collapse折叠栏使用
    - this.$nextTick 请求后，延后重加载

4. lives.vue
    - uni-grid 网格展示
    - uni-tag 标签，v-for循环读取
    - uni.navigateTo页面跳转，传参

5. roomDetail.vue
    - uni.setNavigationBarTitle 设置tab头部标题
    - css的控件绝对定位写法

6. newsDetail和liveDetail
    - 新闻详情页、直播页面，跳转到外部页面后的显示
    - onLoad接收页面跳转传递的参数

7. user.vue
    - 没啥