如何实现小程序内容更新红点提示（微信小程序更新提示）

内容更新时，我们需要在入口处添加一个小红点提示。 这个要求很常见，实现起来并不复杂。 实现场景很多，有web、app、小程序等。 实现思路类似。 在本文中，我们将从登录和未登录两种情况为您提供解决问题的完整思路。

具有登录状态

比较常见的做法是，当用户具有登录状态时，在后台将用户的阅读时间填充到用户数据信息中。 当内容更新时，内容更新时间会添加到用户观看时间中。 我们来对比一下时代吧。 如果用户的观看时间早于内容更新时间，用户会在入口处看到一个小红点，表示有未读的更新内容。

1. 更新数据

第一步是更新数据。 除了常规数据字段之外，您还应该注意新的更新时间字段。 这样，当用户检索数据时，在后台将数据更新时间与用户的读取时间进行比较是有用的。

2.获取数据

第二步是获取数据。 检索数据时请携带您的用户ID。 后台收到请求后，查询用户上次阅读时间，以确定用户是否看过。 传递最新内容后，获取用户的已读/未读状态。

如果用户上次读取时间晚于数据上次更新时间，则为未读，接口返回is_read: false。 前端获取到该字段后，请求配置读取接口，后台收到配置完成。 在读取请求后更新用户数据读取时间字段。

如果用户上次读取时间晚于数据上次更新时间，则处于已读状态。 目前没有内容更新，用户不会看到红点提示。

至此，我们就有了一个简单的功能，就是在用户登录状态下显示内容更新红点提示。

无登录状态

如果需要向访客状态的用户推送内容，如何知道该用户是否查看了最新发布的内容？

1. 数据更新

数据更新与登录状态相同。 只需添加更新时间字段即可。

2. 检索数据

检索数据的步骤略有不同。 数据刷新时间仍然从后台检索，而用户最近的读取时间则从浏览器的本地缓存localStorage中检索。 l 用户第一次访问内容页面时更新。ocalStorage的readTime字段表示用户的读取时间。

当您再次访问内容页面时，将localStorage读取时间与数据更新时间进行比较，决定是否更新localStorage读取时间。 这样当内容已更新和内容未更新时，都会显示一个红点。 更新时不再出现提示。 但由于没有登录状态，是否读取最新内容是由客户端浏览器而不是用户决定的，适合弱绑定场景。

总结

本文提供了内容更新时显示红点的解决方案。 我们希望本文能帮助您了解如何为消息通知中的内容更新创建 - 红点提示。 实施过程。

推荐教程：《小程序开发》

PHP快速学习视频免费教程（入门到精通）

如何学习PHP？学习PHP如何才能快速学习PHP？ 这里有简单的 PHP 学习教程（从初学者到专家）。 您可以保存并下载您想学习的朋友。

下载

这几篇文章你可能也喜欢：

• 什么是骨架屏？
• 如何使用vue完成微信官方账号页面（vue开发微信官方账号页面）
• 在html中插入视频的方法有哪些（如何在html中添加视频）？
• 如何用vue完成微信微信官方账号网页(vue写微信官方账号)

本文由主机参考刊发，转载请注明：如何实现小程序内容更新红点提示（微信小程序更新提示） https://zhujicankao.com/123855.html