有没有办法在typescript中描述react生命周期方法？

import React, { Component } from 'react';

interface MyComponentProps {
  // 定义组件的props
}

interface MyComponentState {
  // 定义组件的state
}

class MyComponent extends Component<MyComponentProps, MyComponentState> {
  constructor(props: MyComponentProps) {
    super(props);
    this.state = {};
  }

  // 挂载阶段
  componentDidMount?(): void;

  // 更新阶段
  componentDidUpdate?(prevProps: MyComponentProps, prevState: MyComponentState, snapshot?: any): void;

  // 卸载阶段
  componentWillUnmount?(): void;

  render() {
    return <div>My Component</div>;
  }
}

import React, { useEffect, useState } from 'react';

interface MyComponentProps {
  // 定义组件的props
}

const MyComponent: React.FC<MyComponentProps> = (props) => {
  const [state, setState] = useState<any>({});

  // 模拟componentDidMount
  useEffect(() => {
    // 组件挂载时的逻辑
    return () => {
      // 组件卸载时的逻辑
    };
  }, []); // 空依赖数组表示只在组件挂载和卸载时执行

  // 模拟componentDidUpdate
  useEffect(() => {
    // 组件更新时的逻辑
  }, [props.someProp]); // 依赖数组中包含需要监听的props

  return <div>My Component</div>;
};

type LifecycleMethods<T> = {
  componentDidMount?: () => void;
  componentDidUpdate?: (prevProps: T, prevState: any, snapshot?: any) => void;
  componentWillUnmount?: () => void;
};

interface MyComponentProps {
  // 定义组件的props
}

class MyComponent extends Component<MyComponentProps & LifecycleMethods<MyComponentProps>, MyComponentState> {
  // 组件实现
}

// 错误示例
class MyComponent extends Component<MyComponentProps, MyComponentState> {
  componentDidMount() { // 缺少问号导致类型不匹配
    // 逻辑
  }
}

// 正确示例
class MyComponent extends Component<MyComponentProps, MyComponentState> {
  componentDidMount?(): void { // 添加问号
    // 逻辑
  }
}

// 错误示例
if (someCondition) {
  useEffect(() => {
    // 逻辑
  }, []);
}

// 正确示例
useEffect(() => {
  if (someCondition) {
    // 逻辑
  }
}, [someCondition]);