antd table空状态全局替换

可以通过ConfigProvider全局化配置实现

import { useRoutes } from 'react-router-dom'
import { ConfigProvider } from 'antd'
// 由于 antd 组件的默认文案是英文，所以需要修改为中文
import zhCN from 'antd/lib/locale/zh_CN'
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'

import { routes } from './router'
import theme from '../config/theme'
import 'antd/dist/reset.css'
import Empty from '@/components/Empty'

dayjs.locale('zh-cn')

const App = () => {
  const element = useRoutes(routes)
  return (
    <ConfigProvider
      prefixCls="pre-cls"              // 设置统一样式前缀
      locale={zhCN}                    // 语言包配置
      theme={theme}
      renderEmpty={() => <Empty />}    // 自定义组件空状态
      autoInsertSpaceInButton={false}  // 设置为 false 时，移除按钮中 2 个汉字之间的空格
    >
      {element}
    </ConfigProvider>
  )
}

export default App

另附：

import React from 'react'
import { Empty, Row, Spin } from 'antd'
import { IMAGE_PREFIX } from '@/utils/constant'

interface EmptyProps {
  loading?: string
  [x: string]: unknown
}

const EmptyPage: React.FC<EmptyProps> = (props) => {
  const { loading, ...reset } = props

  return (
    <Row justify="center">
      {loading ? (
        <Spin />
      ) : (
        <Empty
          image={`${IMAGE_PREFIX}/empty.png`}
          description="暂无数据"
          // style={{ padding: 130 }}
          imageStyle={{
            height: 100,
          }}
          {...reset}
        />
      )}
    </Row>
  )
}

export default EmptyPage

// theme.ts
import type { ThemeConfig } from 'antd'

const defineThemeConfig = (config: ThemeConfig): ThemeConfig => {
  return config
}

// 官方可视化配置地址 https://ant.design/theme-editor-cn
export default defineThemeConfig({
  token: {
    colorPrimary: '#266bf6',
    colorPrimaryHover: '#5189f8',
    colorPrimaryActive: '#1e56c5',
    borderRadius: 8,
  },
})