我如何在React中编写Conway的《生命游戏》(Lambda School)

康威的《人生游戏》是由英国数学家约翰·霍顿·康威(John Horton Conway)于1970年设计的细胞自动机。

康威的人生游戏–维基百科

该游戏在1970年10月的《科学美国人》杂志(Martin Gardner)的“ …

en.wikipedia.org

它具有一个“存活”或“死亡”的细胞网格,并通过遵循四个简单规则变成下一代细胞:

  1. 任何具有少于两个活邻居的活细胞都会死亡,好像是人口不足。
  2. 任何有两个或三个活邻居的活细胞都可以存活到下一代。
  3. 任何具有三个以上活邻居的活细胞都会死亡,就好像人口过多一样。
  4. 具有正好三个活邻居的任何死细胞都变成活细胞,就像通过繁殖一样。

第一步是大多数人如何创建React应用程序: create-react-app 。 这是npx create-react-app的别名,需要通过npm install -g create-react-app全局npm install -g create-react-app 。 此过程将为您的应用创建样板代码。 然后,您可以cd yarn start在浏览器窗口中打开新应用。

但是网格呢? 我们如何显示它? 这是使用HTML5画布完成的。 在您的Game.js组件的render(){}return() (JSX区域)内,编写如下代码:

谢谢,享受!