如何在React组件中显式创建未指定的可选属性？

interface MyComponentProps {
  requiredProp: string;
  optionalProp?: string;
}

import PropTypes from 'prop-types';

function MyComponent(props) {
  // ...
}

MyComponent.propTypes = {
  requiredProp: PropTypes.string.isRequired,
  optionalProp: PropTypes.oneOf([undefined]),
};

function MyComponent({ requiredProp, optionalProp }) {
  return (
    <div>
      <p>{requiredProp}</p>
      {optionalProp && <p>{optionalProp}</p>}
    </div>
  );
}

class MyComponent extends React.Component {
  render() {
    const { requiredProp, optionalProp } = this.props;

    return (
      <div>
        <p>{requiredProp}</p>
        {optionalProp && <p>{optionalProp}</p>}
      </div>
    );
  }
}