微信小程序开发日记（2）

嗨嗨（vtuber问候），亲爱的朋友们，我放鸽子很久了，回来写日记了。虽然最后一篇日记有2篇转发和3篇收藏，但我无法获得您的反馈（您在哪里投币和评论？）。

咳咳，现在我们正在看正片。

在上一篇日记中，我教你安装微信小程序开发工具，并使用一个按钮访问新闻API。

今天，我们有一波史诗级别的增强。我们添加了一个导航栏，每个新闻都可以点击。每一类新闻都可以下拉并刷新。刷新的新新闻数据将叠加在旧新闻上，如下图所示。

我忘了说，如果你已经注册了自己的小程序代码，想在手机上运行它，你需要点击开发工具上方的“Real Machine Debugging”。此外，在小程序后台URL信任中添加您购买的新闻api URL。

如果您没有在后台添加网站，并在开发者工具中选中“请勿验证合法域名”，则开发者工具的编译和查看效果没有问题，但无法通过手机的直接普通调试获得新闻数据，因为此时您使用计算机的网络访问新闻API“请勿验证第三方网站”，手机使用手机数据（即使是wifi也没用）。解决方案是单击真正的机器进行调试。

如果在后台添加网站信任，手机数据也可以在半小时内获得新闻API数据。

如果你想与朋友共享这个小程序（它不能共享，真机调试，没有你的帐户也不能完成），你需要使用更多的实名小程序，这很麻烦，所以你最好自己使用。

我还说了更多的话。请看图片：

Emmm补充了另一件事。此小程序的标题栏在此处修改。

让我们先谈谈新闻内容。单击进入详细信息界面。

在我的上一篇日记中，我谈到了导航器url。我们只需要使用这个来创建一个新页面，将我们的新闻详细信息的URL传输到新页面，然后打开它。“国内”选项卡结构如下图所示

记住在json中添加创建的信息

新页面的项目结构如下图所示

创建新的web文件夹和索引文件夹

当在新文件夹中创建新页面时，将同时生成四个文件：js、json、wxml和wxss

现在让我们谈谈“国内标签”中的导航器url

导航器url=“../web/newsweb？weburl=｛｛item.url｝｝”

因为web文件夹和索引文件夹是并行的，所以地址以/

？ 此符号后面是过去传递的变量名和值。此时，在index.js中的数据中，变量名为weburl，值为{{item.url}}}。此url是api返回的特定新闻数据，相当于res.data.result.data.url

我们使用导航器url将其发送到newsweb，因此我们需要在newsweb.js中编写接收方法

此时，函数中的选项（options）包含刚刚传递的数据变量weburl。使用setData方法更新新闻网站的数据数据。js，然后在newsweb.wxml中编写相应的结构。

你没有弄错。wxml中只有一行。我们使用web视图方法打开内置浏览器并跳转到所需页面。

当我们点击索引中的新闻时。wxml，导航器url被触发。此时，界面跳转到新闻网。wxml和newsweb。js获取数据，使用内置的web视图打开新闻页面（该页面是外部的，就像您可以单击uc和其他浏览器手动查看新闻一样，所以它有广告，但不同的是，您可以打开内置的页面，然后通过小程序标题栏左侧的箭头返回）

接下来，让我们谈谈标签切换。

这一次我们不能像上一次的日记那样开发和编写结构，因为上一次我们只有一个按钮来获取第一类新闻。这次我们有五个标签和五种新闻。（当然，也可以使用一个，但我很懒。复制和粘贴是最快的。233）在我的项目中，面板结构位于选项卡下。您可以在选项卡外只写一个面板，然后通过确定单击哪个选项卡直接覆盖数据中的新闻类型数据。

此选项卡由创建

这用于在数据中的activeIndex=At 1时切换选项卡结构的内容。

使用此e.currentTarget。id以获取单击的值，然后键入以修改新闻请求类型

我们使用onPullDownRefresh方法来下拉刷新。记得在index.json中添加下拉刷新的权限。

if（（that.data.list_data.title）！=（res.data.result.data.title））

可以看出，在下拉刷新期间，我们请求一次新闻数据，并判断数据中的数据是否与