diff --git a/docs/api/window/communication.md b/docs/api/window/communication.md
index 014c79821044c488aee0b688b096fe0440f37a2e..1eb29b07bbd8ccd0d810a3c22cf04486f89f9576 100644
--- a/docs/api/window/communication.md
+++ b/docs/api/window/communication.md
@@ -66,10 +66,65 @@
 - 提供的回调必须跟$on的回调为同一个才能移除这个回调的监听器；
 
 **代码示例**
-```javascript
-	uni.$off('update',function(data){
-		console.log('移除 update 自定义事件');
-	})
+
+`$emit`、`$on`、`$off`常用于跨页面、跨组件通讯，这里为了方便演示放在同一个页面
+
+```html
+	<template>
+		<view class="content">
+			<view class="data">
+				<text>{{val}}</text>
+			</view>
+			<button type="primary" @click="comunicationOff">结束监听</button>
+		</view>
+	</template>
+	
+	<script>
+		export default {
+			data() {
+				return {
+					val: 0
+				}
+			},
+			onLoad() {
+				setInterval(()=>{
+					uni.$emit('add', {
+						data: 2
+					})
+				},1000)
+				uni.$on('add', this.add)
+			},
+			methods: {
+				comunicationOff() {
+					uni.$off('add', this.add)
+				},
+				add(e) {
+					this.val += e.data
+				}
+			}
+		}
+	</script>
+	
+	<style>
+		.content {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+		}
+	
+		.data {
+			text-align: center;
+			line-height: 40px;
+			margin-top: 40px;
+		}
+	
+		button {
+			width: 200px;
+			margin: 20px 0;
+		}
+	</style>
+	
 ```
 
 
diff --git a/docs/collocation/frame/communication.md b/docs/collocation/frame/communication.md
index 014c79821044c488aee0b688b096fe0440f37a2e..1eb29b07bbd8ccd0d810a3c22cf04486f89f9576 100644
--- a/docs/collocation/frame/communication.md
+++ b/docs/collocation/frame/communication.md
@@ -66,10 +66,65 @@
 - 提供的回调必须跟$on的回调为同一个才能移除这个回调的监听器；
 
 **代码示例**
-```javascript
-	uni.$off('update',function(data){
-		console.log('移除 update 自定义事件');
-	})
+
+`$emit`、`$on`、`$off`常用于跨页面、跨组件通讯，这里为了方便演示放在同一个页面
+
+```html
+	<template>
+		<view class="content">
+			<view class="data">
+				<text>{{val}}</text>
+			</view>
+			<button type="primary" @click="comunicationOff">结束监听</button>
+		</view>
+	</template>
+	
+	<script>
+		export default {
+			data() {
+				return {
+					val: 0
+				}
+			},
+			onLoad() {
+				setInterval(()=>{
+					uni.$emit('add', {
+						data: 2
+					})
+				},1000)
+				uni.$on('add', this.add)
+			},
+			methods: {
+				comunicationOff() {
+					uni.$off('add', this.add)
+				},
+				add(e) {
+					this.val += e.data
+				}
+			}
+		}
+	</script>
+	
+	<style>
+		.content {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+		}
+	
+		.data {
+			text-align: center;
+			line-height: 40px;
+			margin-top: 40px;
+		}
+	
+		button {
+			width: 200px;
+			margin: 20px 0;
+		}
+	</style>
+	
 ```