解决 chat 消息多次监听问题

icssoa · icssoa · commit 3fecc4f64be6 · 2021-03-25T10:47:44.000+08:00
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "cool-admin-vue",
-	"version": "3.1.6",
+	"version": "3.1.7",
 	"scripts": {
 		"serve": "vue-cli-service serve",
 		"build": "vue-cli-service build",
diff --git a/src/cool/modules/chat/components/chat.vue b/src/cool/modules/chat/components/chat.vue
@@ -15,11 +15,17 @@
 			:controls="['slot-session', 'cl-flex1', 'fullscreen', 'close']"
 		>
 			<div class="cl-chat">
+				<!-- 会话列表 -->
 				<chat-session />
 
-				<div class="cl-chat__detail" v-if="session">
+				<div class="cl-chat__detail">
+					<!-- 消息列表 -->
 					<chat-message />
-					<chat-input />
+
+					<template v-if="session">
+						<!-- 输入框 -->
+						<chat-input />
+					</template>
 				</div>
 			</div>
 
diff --git a/src/cool/modules/chat/components/message.vue b/src/cool/modules/chat/components/message.vue
@@ -194,19 +194,22 @@ export default {
 		}
 	},
 
+	beforeCreate() {
+		// 销毁事件
+		eventBus.$off("message.refresh");
+		eventBus.$off("message.scrollToBottom");
+	},
+
 	created() {
 		// 监听列表刷新
 		eventBus.$on("message.refresh", this.refresh);
 
 		// 滚动到底部
 		eventBus.$on("message.scrollToBottom", this.scrollToBottom);
-
-		if (this.session) {
-			this.refresh();
-		}
 	},
 
 	destroyed() {
+		// 清除播放
 		clearTimeout(this.voice.timer);
 
 		this.messageList.map(e => {
diff --git a/src/cool/modules/chat/components/session.vue b/src/cool/modules/chat/components/session.vue
@@ -89,6 +89,11 @@ export default {
 		}
 	},
 
+	beforeCreate() {
+		// 销毁事件
+		eventBus.$off("session.refresh");
+	},
+
 	created() {
 		// 监听列表刷新
 		eventBus.$on("session.refresh", this.refresh);
diff --git a/src/cool/modules/demo/views/demo.vue b/src/cool/modules/demo/views/demo.vue
@@ -1,20 +1,11 @@
 <template>
-	<el-scrollbar>
-		<div class="demo">
-			<el-row :gutter="10">
-				<el-col
-					v-for="(item, index) in list"
-					:key="index"
-					:xs="24"
-					:sm="12"
-					:md="8"
-					:lg="6"
-				>
-					<component :is="item"></component>
-				</el-col>
-			</el-row>
-		</div>
-	</el-scrollbar>
+	<div class="demo scroller1">
+		<el-row :gutter="10">
+			<el-col v-for="(item, index) in list" :key="index" :xs="24" :sm="12" :md="8" :lg="6">
+				<component :is="item"></component>
+			</el-col>
+		</el-row>
+	</div>
 </template>
 
 <script>
@@ -58,8 +49,6 @@ export default {
 
 <style lang="scss">
 .demo {
-	overflow: hidden;
-
 	.scope {
 		background-color: #fff;
 		border-radius: 3px;
diff --git a/src/cool/modules/demo/views/upload.vue b/src/cool/modules/demo/views/upload.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="demo-upload">
+	<div class="demo-upload scroller1">
 		<div class="demo-upload__item">
 			<p>普通上传</p>
 			<cl-upload :before-upload="onBeforeUpload"></cl-upload>
@@ -63,8 +63,6 @@ export default {
 
 <style lang="scss" scoped>
 .demo-upload {
-	overflow: hidden auto;
-
 	.demo-upload__item {
 		margin-bottom: 10px;
 		background-color: #fff;

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "cool-admin-vue",`
`3`		`- "version": "3.1.6",`
	`3`	`+ "version": "3.1.7",`
`4`	`4`	`"scripts": {`
`5`	`5`	`"serve": "vue-cli-service serve",`
`6`	`6`	`"build": "vue-cli-service build",`