over_react_missing_key

Severity: AnalysisErrorSeverity.WARNING

Maturity: stable

Since 1.0.0

View the Project on GitHub workiva/over_react

PREFER Setting a unique props.key value for each ReactElement within iterators.

GOOD:

class NavComponent extends UiComponent<NavProps> {
  @override
  render() {
    return (Dom.nav()
      ..modifyProps(addUnconsumedDomProps)
    )(
      props.itemModels.map(_renderItem),
    );
  }
  
  List<ReactElement _renderItem(NavItemModel itemModel) {
    return (NavItem()
      ..model = itemModel
      ..key = itemModel.key
    )(itemModel.displayText);
  }
}

BAD:

class NavComponent extends UiComponent<NavProps> {
  @override
  render() {
    return (Dom.nav()
      ..modifyProps(addUnconsumedDomProps)
    )(
      props.itemModels.map(_renderItem),
    );
  }
  
  List<ReactElement _renderItem(NavItemModel itemModel) {
    return (NavItem()
      ..model = itemModel
    )(itemModel.displayText);
  }
}
Read more about keys