[Suggestion]: Improve code in Tic-Tac-Toe demo
未关闭
还没有人认领这个 Issue。
type: documentation
- 主要语言
- JavaScript
- 星标
- 11.8k
- 派生
- 7.9k
- 平均合并
- 1 天 11 小时
- 30 天内合并 PR
- 11
描述
Summary
I believe there's a good scope to improve the code in the Tic-Tac-Toe example here.
Page
https://react.dev/learn/tutorial-tic-tac-toe
Details
- The
Boardcomponent returns theSquarecomponent statically. This could instead be returned dynamically using themapmethod. This will also be a good way to demonstrate thekeyprop. - Talking about the styling, instead of defining a
board-rowclass that puts each box in a row, we can instead use a grid container with 3 columns andfit-contentwidth. - Instead of attaching a click listener to each box, the click event handling can be delegated to the parent container.
贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
调研方向
打开 https://react.dev/learn/tutorial-tic-tac-toe 中的 Tic-Tac-Toe 教程,并查看 Board、Square 和 styling 示例。更新演示,使其使用 map 生成方格并演示 key,使用三列网格,并将点击委托给父容器;教程应继续保持易于理解且功能正常。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- javascript, react
- 领域
- documentation, frontend
- Issue 类型
- 重构
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 45/100