|
1 | 1 | import extend from 'lodash/extend';
|
2 | 2 | import random from 'lodash/random';
|
| 3 | +import uniqueId from 'lodash/uniqueId'; |
3 | 4 | import uniq from 'lodash/uniq';
|
4 | 5 | import React from 'react';
|
5 | 6 | import ReactDOM from 'react-dom';
|
@@ -37,22 +38,22 @@ class App extends React.Component {
|
37 | 38 | }
|
38 | 39 | render() {
|
39 | 40 | const simpleList = this.state.simpleList.map((val, key) => (
|
40 |
| - <li key={key} data-id={val}>List Item {val}</li> |
| 41 | + <li key
8000
={uniqueId()} data-id={val}>List Item {val}</li> |
41 | 42 | ));
|
42 | 43 | const groupLeft = this.state.groupLeft.map((val, key) => (
|
43 |
| - <div key={key} data-id={val}>{val}</div> |
| 44 | + <div key={uniqueId()} data-id={val}>{val}</div> |
44 | 45 | ));
|
45 | 46 | const groupRight = this.state.groupRight.map((val, key) => (
|
46 |
| - <div key={key} data-id={val}>{val}</div> |
| 47 | + <div key={uniqueId()} data-id={val}>{val}</div> |
47 | 48 | ));
|
48 | 49 | const cloneUncontrolled = this.state.cloneUncontrolled.map((val, key) => (
|
49 |
| - <li key={key} data-id={val}>{val}</li> |
| 50 | + <li key={uniqueId()} data-id={val}>{val}</li> |
50 | 51 | ));
|
51 | 52 | const cloneControlledSource = this.state.cloneControlledSource.map((val, key) => (
|
52 |
| - <li key={key} data-id={val}>{val}</li> |
| 53 | + <li key={uniqueId()} data-id={val}>{val}</li> |
53 | 54 | ));
|
54 | 55 | const cloneControlledTarget = this.state.cloneControlledTarget.map((val, key) => (
|
55 |
| - <li key={key} data-id={val}>{val}</li> |
| 56 | + <li key={uniqueId()} data-id={val}>{val}</li> |
56 | 57 | ));
|
57 | 58 |
|
58 | 59 | return (
|
|
0 commit comments