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??)

Bắt đầu với ví dụ TodoApp_2_1.re và xác nhận xem mã nguồn ban đầu của nó có sẵn hay không, vì issue cho biết repository này có thể chỉ chứa tài liệu được tạo tự động. Cập nhật ví dụ kết xuất danh sách để mỗi TodoItem có key được mô tả, sau đó xác minh rằng trình duyệt không còn báo lỗi liên quan đến key được hiển thị trong bundle.js.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.