File tree Expand file tree Collapse file tree 2 files changed +6
-6
lines changed Expand file tree Collapse file tree 2 files changed +6
-6
lines changed Original file line number Diff line number Diff line change 1
1
---
2
- title : ' 与 Effect 同步'
2
+ title : ' 使用 Effect 同步'
3
3
---
4
4
5
5
<Intro >
@@ -307,7 +307,7 @@ function VideoPlayer({ src, isPlaying }) {
307
307
console .log (' 调用 video.pause()' );
308
308
ref .current .pause ();
309
309
}
310
- }, []); // 浙江产生错误
310
+ }, []); // 这将产生错误
311
311
312
312
return < video ref= {ref} src= {src} loop playsInline / > ;
313
313
}
@@ -510,7 +510,7 @@ export function createConnection() {
510
510
console .log (' ✅ 连接中……' );
511
511
},
512
512
disconnect () {
513
- console .log (' ❌ 连接失败 。' );
513
+ console .log (' ❌ 连接断开 。' );
514
514
}
515
515
};
516
516
}
@@ -568,7 +568,7 @@ export function createConnection() {
568
568
console .log (' ✅ 连接中……' );
569
569
},
570
570
disconnect () {
571
- console .log (' ❌ 连接失败 。' );
571
+ console .log (' ❌ 连接断开 。' );
572
572
}
573
573
};
574
574
}
@@ -583,7 +583,7 @@ input { display: block; margin-bottom: 20px; }
583
583
现在在开发模式下,控制台会打印三条记录:
584
584
585
585
1. ` " ✅ 连接中……" `
586
- 2. ` " ❌ 连接失败 。" `
586
+ 2. ` " ❌ 连接断开 。" `
587
587
3. ` " ✅ 连接中……" `
588
588
589
589
**在开发环境下,出现这样的结果才是符合预期的**。重复挂载组件,可以确保在 React 中离开和返回页面时不会导致代码运行出现问题。上面的代码中规定了挂载组件时连接服务器、卸载组件时断连服务器。所以断开、连接再重新连接是符合预期的行为。当为 Effect 正确实现清理函数时,无论 Effect 执行一次,还是执行、清理、再执行,用户都不会感受到明显的差异。所以,在开发环境下,出现额外的连接、断连时,这是 React 正在调试你的代码。这是很正常的现象,不要试图消除它!
Original file line number Diff line number Diff line change 169
169
"path" : " /learn/manipulating-the-dom-with-refs"
170
170
},
171
171
{
172
- "title" : " Synchronizing with Effects " ,
172
+ "title" : " 使用 Effect 同步 " ,
173
173
"path" : " /learn/synchronizing-with-effects"
174
174
},
175
175
{
You can’t perform that action at this time.
0 commit comments