[Suggestion]: Other method to fix issue rather than depending on useEffect

未关闭
#7,248 1 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
3/5
预计耗时
1-2 天
新手友好度
35/100
Issue 类型
文档
描述清晰度
基本清楚
活跃度
停滞
技术栈
javascript, react
领域
documentation

调研方向

从链接的 React 文档页面中的“Synchronizing with Effects”部分及其视频示例开始。将提议的受 ref 保护的替代方案与现有的 useEffect 说明进行比较,然后确定该页面是否应该提及它。当文档准确呈现相关选项及其预期使用场景时,即视为完成。

由索引模型根据 Issue 内容生成。

描述

type: documentation
Summary

In Synchronizing with effects section https://react.dev/learn/synchronizing-with-effects inside learn, there's a video section where we show issues in using ref and setting play/pause methods with ref and it raises error

`function VideoPlayer({ src, isPlaying }) {
const ref = useRef(null);
if (isPlaying) {
ref.current.play(); // Calling these while rendering isn't allowed.
} else {
ref.current.pause(); // Also, this crashes.
}

return ;
}`

And below it we say way to solve this is by using useEffect

But rather we can use following way instead to solve the issue. I guess we should tell readers that this can also be possible way but here we'll see how we can solve with useEffect.

`function VideoPlayer({ src, isPlaying }) {
const ref = useRef(null);
if(ref.current !== null){
if (isPlaying) {
ref.current.play(); // Calling these while rendering isn't allowed.
} else {
ref.current.pause(); // Also, this crashes.
}
}

return ;
}`

Page

https://react.dev/learn/synchronizing-with-effects

Details

I think we should show readers this way of solving the null Ref issue. This will help them to understand different ways and correct usecase of useEffect.

Subsection URL - https://react.dev/learn/synchronizing-with-effects

主要语言
JavaScript
星标
11.8k
派生
7.9k
平均合并
16 小时 6 分钟
30 天内合并 PR
7

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

reactjs/react.dev 的其他 Issue

查看 reactjs/react.dev 的全部 Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。