实验4：高校新闻网

2022年夏季《移动软件开发》实验报告

姓名：潘摅宇 学号：20170001048

姓名和学号？	潘摅宇，20170001048
本实验属于哪门课程？	中国海洋大学22夏《移动软件开发》
实验名称？	实验4：高校新闻网
博客地址？	XXXXXXX
Github仓库地址？	XXXXXXX

（备注：将实验报告发布在博客、代码公开至 github 是 加分项，不是必须做的）

一、实验目标

1、综合所学知识创建完整的前端新闻小程序项目；能够在开发过程中熟练掌握真机预览、调试等操作。

二、实验步骤

1、创建项目并修改文件（图略）

2、创建多个页面以及tabBar栏，完成后文件列表如下图

3、导入提供的含有新闻数据的common.js文件，并在其它js文件中引用（图略）。

4、在index文件夹中设计新闻页面，包括滚动幻灯片和新闻列表，效果图及部分代码如下：

5、在my文件夹中设计个人主页，效果图及部分代码如下：

6、在detail文件夹设计新闻页面，效果图及部分代码如下：

7、设计新闻页逻辑，即打开新闻并跳转入detail页面的方法，关键代码如下：

8、设计收藏功能，关键代码如下：

9、在my文件夹添加代码实现登录功能，代码与实验1大致相同（图略）。

10、在my文件夹添加函数以获取收藏列表，关键代码如下：

11、在my文件夹添加goToDetail函数使收藏列表能够唤醒详细新闻页面，函数与index文件夹中的相同（图略）。

三、程序运行结果

四、问题总结与体会

问题：

1、使用实验文档提供的代码无法正常获取用户昵称和头像。

解决方法：使用最新的API，参考实验1。

2、收藏列表无法唤醒新闻页面。

解决方法：忘了在my.js中添加goToDetail函数，将其补上。

3、收藏列表总是多出一项空的新闻列表。

解决方法：修改getMyFavorites函数，将myList数组截取第一到倒数第二项后赋给newsList数组，同时将num减1，具体修改见下图：

体会：了解了多页面的实现方式，掌握了页面间跳转的实现方法，同时学习了幻灯片组件的相关内容。