From 58e9f1fccf2ed67d98ee08e100fad57854aa26b2 Mon Sep 17 00:00:00 2001
From: Sam <ffxsam@users.noreply.github.com>
Date: Wed, 13 Jan 2016 23:36:47 -0800
Subject: [PATCH] Fixed bad key

Never use indices for keys in React. React depends on fully unique values for keys, so when items are added or removed, it can accurately shift them around in the DOM in the most efficient manner. The only instance where the user would see things go wrong is if you were using `ReactCSSTransitionGroup` to make items fade in and out as they appear/disappear. If you were to use the index as the key, you'd see some wonky things happen with the animation.
---
 docs/basics/UsageWithReact.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/basics/UsageWithReact.md b/docs/basics/UsageWithReact.md
index b93346cb56..76e4afb6ac 100644
--- a/docs/basics/UsageWithReact.md
+++ b/docs/basics/UsageWithReact.md
@@ -154,7 +154,7 @@ export default class TodoList extends Component {
       <ul>
         {this.props.todos.map((todo, index) =>
           <Todo {...todo}
-                key={index}
+                key={index + todo.text}
                 onClick={() => this.props.onTodoClick(index)} />
         )}
       </ul>