over_react_string_ref

Severity: AnalysisErrorSeverity.INFO

Maturity: stable

Since 1.0.0

View the Project on GitHub workiva/over_react

PREFER to use the return value of createRef() as the ref field value since string refs are deprecated in ReactJS.

GOOD:

class NavItemWrapperComponent extends UiComponent<NavItemWrapperProps> {
  final _navItemRef = createRef<NavItemComponent>();
  
  @override
  render() {
    return Fragment()(
      (NavItem()
        ..modifyProps(addUnconsumedProps)
        ..ref = _navItemRef
      )(props.children),
      (Dom.button()
        ..type = 'button'
        ..onClick = _handleClick
      )('Activate the item'),
    );
  }
  
  void _handleClick(_) {
    _navItemRef.current.activate();
  }
}

BAD:

class NavItemWrapperComponent extends UiComponent<NavItemWrapperProps> {
  @override
  render() {
    return Fragment()(
      (NavItem()
        ..modifyProps(addUnconsumedProps)
        ..ref = '_navItemRef'
      )(props.children),
      (Dom.button()
        ..type = 'button'
        ..onClick = _handleClick
      )('Activate the item'),
    );
  }
  
  void _handleClick(_) {
    (ref('_navItemRef') as NavItemComponent).activate();
  }
}
Read more about createRef()