Custom hook example has missing dependency
未关闭
适合新手
还没有人认领这个 Issue。
- 主要语言
- JavaScript
- 星标
- 11.8k
- 派生
- 7.9k
- 平均合并
- 1 天 11 小时
- 30 天内合并 PR
- 11
描述
Regarding 'Building Your Own Hook' page (github link).
Small but critical mistake in custom hook example for function useFriendStatus(). It needs a dependency. I.E.
Change line 91 by inserting , [friendID].
Without the dependency this appears to be 'magic'. I found I had to add a dependency when writing my learning hook, otherwise my counter just spins indefinitely.
Example
Custom hook:
function useCounter(targetId: string) {
const [counter, setCounter] = useState(0);
useEffect(() => {
setCounter(counter+1);
}, [targetId]);
return counter;
}
Client code:
interface MainProps {
counterTargetId: string;
}
export default function MainPage(props: MainProps = {
counterTargetId: 'a',
}) {
const currentCount = useCounter(props.counterTargetId);
return (<div>
<p>
Count: {currentCount}
</p>
</div>);
}
function App() {
const [targetId, setTargetId] = useState('a');
return (
<div className="App">
<input
type="button"
value="Toggle"
onClick={() => setTargetId(targetId === 'a' ? 'b' : 'a')}/>
<MainPage counterTargetId={targetId}/>
</div>
)
}
贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
调研方向
打开 content/docs/hooks-custom.md,检查第 91 行附近的 useFriendStatus() 示例。按照描述更新示例的依赖项列表,然后验证文档是否正确渲染,以及示例是否显示了预期的依赖项。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- javascript, react
- 领域
- documentation
- Issue 类型
- 文档
- 难度
- 1/5
- 预计耗时
- 1 小时以内
- 活跃度
- 停滞
- 描述清晰度
- 描述清楚
- 新手友好度
- 70/100