Изменить функцию рендеринга внешнего компонента React (без доступа)

Хотя общедоступные методы и свойства компонента доступны refs (https://reactjs.org/docs/refs-and-the-dom.html) шаблон, который вы ищете, - это компоненты высокого порядка (HOC, https://reactjs.org/docs/higher-order-components.html)

Если компонент не был разработан для настройки, нет простого способа сделать это.

Button - пример плохо спроектированного компонента, потому что он не принимает дополнительных свойств. Проблема и PR могут быть отправлены в репозиторий для решения исходной проблемы.

В расширенном компоненте это можно исправить, передав свойства из расширенного компонента.

Родительский render результат может быть изменен:

class ButtonExtend extends Button {
 // ... more code above  
 render() {
  const button = super.render();
  const { symbol, children, ...props } = this.props;

  return React.cloneElement(button, {
    children: [
      symbol && <Icon symbol={symbol} />,
      ...children
    ],
    ...props
  });
}

Если элемент, который необходимо изменить, является вложенным, это может стать беспорядочным и привести к созданию ненужных элементов.

Более чистый способ - вставить render в расширенный компонент и изменить его:

class ButtonExtend extends Button {
 // ... more code above  
 render() {
  const { symbol, children, ...props } = this.props;

  return (
    <button className={this.getClasses()} {...props}/>
      {symbol && <Icon symbol={symbol} />}
      {children}
    </button>
  )
 }
}

Таким образом, его можно использовать как

<ButtonExtend onClick={resetState} type="submit" name="extended button" />