如何处理共享React组件上的onClick为空？

import React from 'react';

class SharedComponent extends React.Component {
  static defaultProps = {
    onClick: () => {}
  };

  render() {
    return (
      <button onClick={this.props.onClick}>
        Click Me
      </button>
    );
  }
}

export default SharedComponent;

import React from 'react';

class SharedComponent extends React.Component {
  render() {
    const { onClick } = this.props;
    return (
      onClick ? (
        <button onClick={onClick}>
          Click Me
        </button>
      ) : null
    );
  }
}

export default SharedComponent;

import React from 'react';

class SharedComponent extends React.Component {
  handleClick = () => {
    if (this.props.onClick) {
      this.props.onClick();
    } else {
      alert('No action defined for this button.');
    }
  };

  render() {
    return (
      <button onClick={this.handleClick}>
        Click Me
      </button>
    );
  }
}

export default SharedComponent;