错误边界组件

export const UliveErrorBoundary = (props: ErrorBoundaryProps) => {
  const { onError, fallbackRender, children, componentName } = props;

  const handleError = useCallback(
    (error, info) => {
      let errorStr = '';
      if (error) {
        if (typeof error === 'string') {
          errorStr = error;
        } else {
          errorStr = error?.toString?.() || safeStringify(error);
        }
      }
      const msgStr = safeStringify({
        errorStr,
        compoment: isProduction ? children : null,
      });

      wpk.report({
        category: 123, // 系统自动生成，请勿修改
        msg: componentName, // 将根据msg字段聚合展示在平台的top上报内容中
        c1: errorStr?.startsWith('ChunkLoadError') ? 'ChunkLoadError' : 'ComponentError',
        c2: error?.message,
        bl1: msgStr,
        bl2: error?.stack,
      });
      console.error(error);
      onError && onError(error, info);
    },
    [onError],
  );

  return (
    <ErrorBoundary
      fallback={
        <CommonFallbackRender
          name={componentName}
          fallbackRender={fallbackRender}
        ></CommonFallbackRender>
      }
      onError={handleError}
    >
      {children}
    </ErrorBoundary>
  );
};

// 使用
<UliveErrorBoundary componentName="DragonSlayerEntryFirst">
      <Card {...props} lotteryIndex={0} />
    </UliveErrorBoundary>