Warning: Each child in an array or iterator should have a unique “key” prop. Check the render method

Warning: Each child in an array or iterator should have a unique “key” prop. Check the render method of `HomePage`. See https://fb.me/react-warning-keys for more information.
in div (created by HomePage)
in HomePage (created by Connect(HomePage))
in Connect(HomePage) (created by RouterContext)
in div (created by App)
in div (created by App)
in div (created by App)
in div (created by App)
in div (created by App)
in div (created by App)
in MuiThemeProvider (created by App)
in App (created by Connect(App)
in Connect(App) (created by RouterContext)
in RouterContext (created by Router)
in Router
in Provider

Whether or not to add a single key to the div

render() {
    return (
      <ol>
        {this.props.results.map((result, i) => (
          <li key={i}>{result.text}</li>
        ))}
      </ol>
    );
}
 return (<div key={index}>
                                        <div key={index + 0 } style={{ display: 'flex' }}>
                                            <div style={{
                                                color: '#212121',
                                                flex: '1',
                                                padding: '8px 8px 8px 0px ',
                                            }}>
                                                <img
                                                    src={imgLine}
                                                    style={{
                                                        height: '14px',
                                                        width: '3px',
                                                        margin: '4px 2px 6px 0px'
                                                    }}/>
                                                <span>{item.groupName}</span>
                                            </div>
                                            <div style={{ flex: '1', padding: '8px', textAlign: 'right' }}>
                                                <a onClick={() => browserHistory.push(`/groupVideoList/${groupId}`)}
                                                   style={{ color: '#212121' }}>More></a>
                                            </div>
                                            <div style={{ clear: 'both' }}/>
                                        </div>
                                        <div key={index + 1 }>
                                            <GridList cellHeight={172} style={styles.gridList} cols={2}>
                                                {
                                                    resources.map((item, index) => (
                                                        <ResourceListItem
                                                            msgTip={() => this.gotoResourcePlayPage(item.resourceId, item.type)}
                                                            theme={this.context.muiTheme.card}
                                                            key={`resource-item-${index}`}
                                                            item={item}
                                                            actionHandler={dispatch}
                                                        />
                                                    ))
                                                }
                                            </GridList>
                                        </div>
                                    </div>
                                )

Similar Posts: