如何在小程序里一键清除未读消息?
使用触发器的隐藏,实现列表消息的清除。
效果展示
前置准备
1. 消息列表素材
具体步骤(6)
1. 添加消息列表背景
2.制作标题
3.制作标记已读
4.制作未读消息气泡
5.创建隐藏触发器
6.创建标记已读触发器
步骤分解
1.添加消息列表背景
1.1. 拖拽 图片组件 到 根容器
1.2. 选中 图片组件
1.3. 点击 检查面板 中的 数据绑定与设置
1.4. 上传图片素材
1.5. 点击 检查面板 中的 样式
1.6. 调整 图片组件 样式
2.制作标题
2.1. 拖拽 标签文本 到 根容器
2.2. 选中 标签文本
2.3. 点击 检查面板 中的 样式
2.4. 配置 标签文本 样式
3.制作标记已读
3.1. 拖拽 标签文本 到 根容器
3.2. 选中 标签文本
3.3. 点击 检查面板 中的 样式
3.4. 配置 标签文本 样式
3.5. 拖拽 标签组件 到 根容器
3.6. 点击 检查面板 中的 数据绑定与设置
3.7. 选择 图标
3.8. 选中 图标
3.9. 点击 检查面板 中的 样式
3.10. 配置图标 样式
4.制作未读消息气泡
4.1. 拖拽 标签文本 到 消息列表素材
4.2. 选中 标签文本
4.3. 点击 检查面板 中的 样式
4.4. 调整 标签文本 的 样式
5.创建隐藏触发器
5.1. 选中未读消息气泡
5.2. 点击 检查面板 中的 触发器
5.3. 配置 触发器
5.4. 其余未读消息气泡操作逻辑相同
6.创建标记已读触发器
5.1. 选中标记已读 标签文本
5.2. 点击 检查面板 中的 触发器
5.3. 配置 触发器
这样就可以一键清除未读消息了。
本文转载自知乎:如何在小程序里一键清除未读消息? - TOWIFY的文章 - 知乎
https://zhuanlan.zhihu.com/p/585268643
赞 (0)