react try catch

class ErrorBoundary extends React.Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false };
  }

  static getDerivedStateFromError(error) {
    return { hasError: true };
  }

  componentDidCatch(error, errorInfo) {
    logErrorToMyService(error, errorInfo);
  }

  render() {
    if (this.state.hasError) {
      return <h1>Something went wrong.</h1>;
    }

    return this.props.children; 
  }
}

// 使用ErrorBoundary包裹可能出错的组件
<ErrorBoundary>
  <MyComponent />
</ErrorBoundary>

const MyComponent = () => {
  const handleClick = async () => {
    try {
      const response = await fetch('https://api.example.com/data');
      const data = await response.json();
      // 处理数据
    } catch (error) {
      console.error('Fetch error:', error);
      // 显示错误信息或采取其他措施
    }
  };

  return <button onClick={handleClick}>Fetch Data</button>;
};