消息角标显示未读消息数量

App.vue

@@ -1,20 +1,33 @@
 <script>
-	export default {
-		onLaunch: function() {
+export default {
+	onLaunch: function () {
 
-		},
-		onShow: function() {},
-		onHide: function() {}
-	}
+	},
+	async onShow() {
+		const getMessageCount = async () => {
+			let res = await this.$http.get('/message/getMessageCount')
+			if (res.code == 200) {
+				uni.setTabBarBadge({
+					index: 2,//tabbar的索引
+					text: res.data['999'] + ''
+				})
+			}
+		}
+		setInterval(() => {
+			getMessageCount()
+		}, 30000);
+	},
+	onHide: function () { }
+}
 </script>
 
 <style lang="scss">
-	/* #ifndef APP-PLUS-NVUE */
-	/*每个页面公共css */
-	/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
+/* #ifndef APP-PLUS-NVUE */
+/*每个页面公共css */
+/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
 
-	@import "uview-ui/index.scss";
-	/* 公共样式库 */
-	@import "/style/zcm-main.css";
-	/* #endif */
+@import "uview-ui/index.scss";
+/* 公共样式库 */
+@import "/style/zcm-main.css";
+/* #endif */
 </style>

pages/message/message.vue

@@ -165,6 +165,10 @@ export default {
 					}
 					return item;
 				});
+				uni.setTabBarBadge({
+					index: 2,//tabbar的索引
+					text: res.data['999'] + ''
+				})
 			}
 		},
 		//获取信息