👀 查看结果
让我们看看我们的应用程序现在的样子！
打开一个新的终端，导航到client文件夹，其中 cd client，并使用 npm start运行该应用程序。此操作将在浏览器中的 localhost:3000上运行该应用程序。
我们在主页上看到了所有课程。现在让我们点击第二个课程，我们应该会看到此处显示的观看次数。
如果我们返回主页并再次点击该课程，我们现在会看到观看次数已经增加了！超赞！
注意：请记住，您的观看次数可能与视频中的观看次数不同！若要检查您的 突变成功，请打开浏览器的开发人员工具，找到 console.log消息，我们在之前设置了该消息。
现在，如果你眼疾手快（或网速较慢 🐌 ），可能会发现一些问题。事实上，让我们打开开发者工具控制台，利用视频魔法将其慢放，以便看看究竟发生了什么。
看到了吗？页面会立即加载所有曲目数据，然后短暂停顿一下，浏览量就会从 2 变成 3！这时，我们可以看到前面设置的控制台日志弹出。这意味着我们的 突变 在页面加载后才完成。那么，在之前我们是如何在没有任何错误的情况下在页面中看到所有内容的？虽然我们在前一个页面中执行了突变，但它又是如何在当前页面中更新的？
🗳️ Apollo 客户端缓存
这要归功于 Apollo 客户端 缓存！
在第三部分起飞 中，我们了解到，如果之前已点击某个曲目，它会在页面上显示得非常快。这是因为该曲目是从缓存中加载的，这意味着我们未向 GraphQL API 发送不必要的查询。
同样，当 突变 被发送到我们的 API 时，页面仍将从缓存中加载。它成功返回后，我们将获得对 numberOfViews 的更新值。 Apollo 客户端 会在后台工作，查看该曲目的 id，在缓存中查找它，并更新其 numberOfViews 字段。缓存更新后，UI 也将更新。感谢 Apollo 客户端！
🥳 就是这样！
您已完成我们的升空系列的第 IV 部分，恭喜！我们现在为有志向的猫航员使用一个正在运行的应用程序来探索宇宙，并且我们可以通过查看次数来了解一条轨道的受欢迎程度。
接下来：我们将学习如何将此应用程序投放到生产环境。 🚀 在升空 V部分再见！
分享您对本课的疑问和评论
您的反馈有助于我们改进！如果您遇到困难或困惑，请告诉我们，我们将帮助您解决问题。所有评论都是公开的，并且必须遵循 Apollo 行为准则。请注意，已解决或处理的评论可能会被删除。
您需要一个 GitHub 帐号才能在下面发帖。您没有帐号吗？ 也可以在我们的 Odyssey 论坛中发帖。