1、综合所学知识创建完整的前端新闻小程序项目；能够在开发过程中熟练掌握真机预览、调试等操作。
列出实验的关键步骤、代码解析、截图。
1.需求分析
本项目一共需要3个页面，即首页、新闻页和个人中心页，其中首页和个人中心页需要以tabBar的形式展示，可以点击tab图标互相切换。
首页功能需求如下：
（1）首页需要包含幻灯片播放效果和新闻列表；
（2）幻灯片至少要有3幅图片自动播放；
（3）点击新闻列表可以打开新闻全文。
新闻页功能需求如下：
（1）阅读新闻全文的页面需要显示新闻标题、图片、正文和日期；
（2）允许 点击按钮将当前阅读的新闻添加到本地收藏夹中；
（3）已经收藏过的新闻也可以点击按钮取消收藏。
个人中心页功能需求如下：
（1）未登录状态下显示登录按钮，用户点击以后可以显示微信头像和昵称。
（2）登录后读取当前用户的收藏夹，展示收藏的新闻列表。
（3）收藏夹中的新闻可以直接点击查看内容。
（4）未登录状态下收藏夹显示为空。
2.页面配置与添加素材
在app.json中的pages属性下添加pages/detail/detail和pages/my/my，保存后生成detail页面和my页面
删除 index.wxml和index.wxss全部代码
删除index.js中全部代码，输入关键词page，找到Page选项回车自动补全函数
删除app.wxss中全部代码
删除app.js中全部代码，输入关键词app，找到App选项回车自动补全函数
在根目录下创建images和util文件夹，分别用于存储图片素材和JS文件
3.视图设计
3.1导航栏设计
在app.json中修改window属性配置导航栏效果
3.2 tabBar设计
首先在app.json中追加tabBar的相关属性代码，属性解释见注释
3.3个人中心页设计
修改my.wxml文件
为登陆面板和我的收藏区域添加内容
修改my.wxss文件
3.4新闻页设计
修改detail.wxml代码
修改detail.wxss代码
4.逻辑实现
在各个页面的js文件顶端引用js文件，作用为使用common.js文件
4.1主页逻辑
(1)新闻列表获取
新闻存储在newList变量中，因此在加载首页时（即启动onLoad函数）获取新闻，并赋值给newList
(2)点击新闻跳转详情
在index.wxml的新闻列表项目的** 组件添加点击事件， data-id**属性携带新闻ID编号用于查询对应新闻
index.js中定义goToDetail点击事件函数
此时点击首页的新闻标题，那么就可以跳转到detail界面，由于detail界面尚未设置接受函数，因此跳转到的页面内容仍为临时数据内容
4.2新闻页逻辑
(1)在首页逻辑中我们在跳转到detail界面时传递了新闻id，现在在新闻页接受id，并查询对应的新闻内容
在detail.js文件中进行修改
保存后，再点击首页新闻标题即可进入对应新闻内容
(2)添加/取消新闻收藏
修改detail.wxml代码，追加两个组件作为添加/取消新闻收藏按钮，且通过wx:if和wx:else属性使其每次只存在一个
对应wxss样式
先修改onload函数，利用wx.getStorageSync(id)返回值判断是否已经收藏当前新闻，收藏isAdd = true 否则为 false
然后在detail.js中添加addFavorites和cancleFavorites事件函数
收藏功能使用到微信小程序API wx.setStorageSync()，能够非常简单实现添加收藏，获取收藏内容等功能
点击第一条新闻，跳转页面后显示未收藏，点击“点击收藏”，按钮显示为“已收藏”
回到主界面，再进入第一条新闻，显示已收藏
4.3个人主页逻辑
(1)获取微信用户信息
修改my.wxml代码，追加组件作为登录按钮，并使用wx:if和wx:else属性让未登录时只显示按钮，登陆后只显示头像和昵称
在my.js中编写getUserInfo函数，获取用户信息，并将信息更新到动态数据上
(2)获取收藏列表
修改my.wxml代码，将“我的收藏（1）”的“1”改为动态数据效果
修改my.wxml文件
在my.js中的data中初始化num为0
继续在my.js中追加getMyFavorites函数，用于展示真正的新闻收藏列表。
然后在getUserInfo()中调用该函数
初始化my.js中data的newsList为空，即删除临时新闻列表数据
这样收藏的功能实际上是将收藏信息保存到本地缓存，用户登录后读取缓存信息，将新闻放到“我的收藏”，并不算真正意义上的收藏，要想事项真正意义的收藏，则应该将用户信息和其收藏信息一并保存，如一并保存到云数据库，在读取用户信息后，到云数据库查询用户信息，进而读取用户收藏。
考虑到登陆成功后用户还可以手动更改新闻的收藏状态，因此修改my.js中的onShow函数（生命周期函数–监听页面显示），判断如果是登陆状态就刷新一下收藏列表。
(3)浏览收藏的新闻
点击收藏的新闻和在首页点击新闻跳转功能相似
修改my.wxml，在显示新闻标题的title的组件 添加点击函数goToDetail，并传递新闻id
在my.js中编写gotoDetail函数实现页面跳转，与首页新闻跳转一致