first list example breaks without a `key` prop

the first example for rendering a list has this code

**TodoApp_2_1.re**
```ocaml
ReasonReact.arrayToElement(Array.of_list(
List.map((item) => , items)
))
```

but although this code will compile correctly, when viewing it in a browser, you'll get the following traceback which hides the fact that the runtime error is to do with `validateExplicitKey`

**`Uncaught TypeError: element._owner.getName is not a function`**

 at validateExplicitKey (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5636:66)

    at validateChildKeys (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5659:9)

    at Object.createElement (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:5747:9)

    at newrecord.(anonymous function) (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:6730:39)

    at Object._1 (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:1052:12)

    at Object.render (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:6250:32)

    at finishClassComponent (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22098:31)

    at updateClassComponent (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22075:12)

    at beginWork (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:22449:16)

    at performUnitOfWork (file:///Users/marcos/projects/a-reason-react-tutorial/public/bundle.js:24440:16)

validateExplicitKey @ bundle.js:5636

validateChildKeys @ bundle.js:5659

createElement @ bundle.js:5747

newrecord.(anonymous function) @ bundle.js:6730

_1 @ bundle.js:1052

render @ bundle.js:6250

finishClassComponent @ bundle.js:22098

updateClassComponent @ bundle.js:22075

beginWork @ bundle.js:22449

performUnitOfWork @ bundle.js:24440

workLoop @ bundle.js:24504

callCallback @ bundle.js:14736

invokeGuardedCallbackDev @ bundle.js:14775

invokeGuardedCallback @ bundle.js:14632

renderRoot @ bundle.js:24582

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

bundle.js:23965 The above error occurred in the  component:

    in TodoApp


Consider adding an error boundary to your tree to customize error handling behavior.

Visit https://fb.me/react-error-boundaries to learn more about error boundaries.

logCapturedError @ bundle.js:23965

captureError @ bundle.js:24756

renderRoot @ bundle.js:24607

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

bundle.js:14782 Uncaught Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development. See https://fb.me/react-crossorigin-error for more information.

    at Object.invokeGuardedCallbackDev (bundle.js:14782)

    at invokeGuardedCallback (bundle.js:14632)

    at renderRoot (bundle.js:24582)

    at performWorkOnRoot (bundle.js:25196)

    at performWork (bundle.js:25148)

    at requestWork (bundle.js:25057)

    at scheduleWorkImpl (bundle.js:24940)

    at scheduleWork (bundle.js:24902)

    at scheduleTopLevelUpdate (bundle.js:25373)

    at Object.updateContainer (bundle.js:25411)

invokeGuardedCallbackDev @ bundle.js:14782

invokeGuardedCallback @ bundle.js:14632

renderRoot @ bundle.js:24582

performWorkOnRoot @ bundle.js:25196

performWork @ bundle.js:25148

requestWork @ bundle.js:25057

scheduleWorkImpl @ bundle.js:24940

scheduleWork @ bundle.js:24902

scheduleTopLevelUpdate @ bundle.js:25373

updateContainer @ bundle.js:25411

(anonymous) @ bundle.js:29428

unbatchedUpdates @ bundle.js:25282

renderSubtreeIntoContainer @ bundle.js:29427

render @ bundle.js:29492

renderToElementWithId @ bundle.js:13825

(anonymous) @ bundle.js:6664

__webpack_require__ @ bundle.js:20

module.exports @ bundle.js:63

(anonymous) @ bundle.js:66

this is easy enough to fix if you use the title as a key (for now at least, or you could horrifically suggest using `List.mapi` and passing...). in any case, the code should probably change to

```diff
ReasonReact.arrayToElement(Array.of_list(
- List.map((item) => , items)
+ List.map((item) => , items)
))
```

at least until the subsequent portion where the items actually do have their own ids.

i tried doing this in a pr, but i'm pretty sure this repo doesn't actually include the original source files and just put stuff here (why not, though, jared??)

从 TodoApp_2_1.re 示例开始，确认其原始源代码是否可用，因为 issue 表示此仓库可能只包含生成的材料。更新列表渲染示例，使每个 TodoItem 都具有所描述的 key，然后验证浏览器不再报告 bundle.js 中显示的 key 相关错误。

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