Keys in react

Download reactjs eBook

Introduction

Keys in react are used to identify a list of DOM elements from the same hierarchy internally.

So if you are iterating over an array to show a list of li elements, each of the li elements needs a unique identifier specified by the key property. This usually can be the id of your database item or the index of the array.

Remarks

Using the array index as a key is generally not recommended when the array is going to change over time. From the React Docs:

As a last resort, you can pass item's index in the array as a key. This can work well if the items are never reordered, but reorders will be slow.

A good example about this: https://medium.com/@robinpokorny/index-as-a-key-is-an-anti-pattern-e0349aece318

Related Examples

Stats

29 Contributors: 2
Sunday, May 7, 2017
Licensed under: CC-BY-SA

Not affiliated with Stack Overflow
Rip Tutorial: info@zzzprojects.com

Download eBook