取消antd 点击的水波纹效果

取消antd按钮点击时出现的动感光圈

子元素多了一个？class ant-wave

隐藏DOM

.ant-wave {
  display: none
} 

或者umirc中配置全局style 配置 (umijs.org)

  styles:[`.ant-wave{display:none}`],

Antd定制主题配置

按钮 Button - Ant Design

定制主题 - Ant Design

import { SmileOutlined } from '@ant-design/icons'
import { App, ConfigProvider } from 'antd'
import locale from 'antd/locale/zh_CN'
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import 'mapbox-gl/dist/mapbox-gl.css'
import React, { PropsWithChildren } from 'react'
import { defineApp } from 'umi'

const customizeRenderEmpty = () => (
  <div style={{ textAlign: 'center' }}>
    <SmileOutlined style={{ fontSize: 20 }} />
    <p>Data Not Found</p>
  </div>
)
dayjs.locale('zh-cn')
const ThemeProvider = ({ children }: PropsWithChildren) => {
  return (
    <ConfigProvider wave={{ disabled: true }}
      locale={locale}
      renderEmpty={customizeRenderEmpty}
      theme={{
        token: {
          colorPrimary: '#24d824',
          colorText: '#fff',
          colorLink: '#fff',
          colorLinkActive: '#24d824',
          colorLinkHover: '#24d824',
          colorBgContainer: 'rgba(0, 0, 0, 0.5)',
          colorTextPlaceholder: 'rgba(255, 255, 255, .3)',
          colorTextDisabled: 'white',
          borderRadius: 0,
          colorPrimaryText: '#24d824',
          colorIcon: '#fff',
          colorIconHover: '#24d824',
          colorBgElevated: '#222',
          colorBorder: '#646464'
        },
        components: {
          Button: {
            colorBgContainer: 'transparent',
            defaultBg: 'transparent',
            defaultActiveColor: '#24d824',
            defaultActiveBorderColor: '#24d824',
            linkHoverBg: 'transparent',
            textHoverBg: 'rgba(36,216,36,.2)',
            defaultHoverBorderColor: '#24d824',
            defaultHoverColor: '#24d824',
            defaultBorderColor: '#646464',
            primaryShadow: 'none',
            borderColorDisabled: '#5d5d5d'
          },
          Dropdown: {
            colorBgElevated: 'rgba(0,0,0,.5)',
            colorText: '#fff'
          },
          Input: {
            activeBg: 'transparent',
            activeBorderColor: '#24d824',
            colorBgContainer: 'transparent',
            activeShadow: '0 0 0 2px rgba(0,0,0,.2)'
          },
          Message: {
            contentBg: 'rgba(0, 0, 0, 0.5)'
          },
          Cascader: {
            optionSelectedBg: '#1a1b1a'
          },
          Modal: {
            contentBg: 'rgba(17,17,17, 0.75)',
            headerBg: 'transparent'
          },
          Segmented: {
            itemSelectedColor: 'black'
          },
          Breadcrumb: {
            itemColor: '#FFFFFF73',
            lastItemColor: '#fff',
            separatorColor: '#FFFFFF73'
          },
          Select: {
            clearBg: '#fff',
            optionSelectedBg: 'rgba(36, 216, 36,.3)',
            optionActiveBg: 'rgba(36, 216, 36,.3)',
            optionSelectedColor: '#24d824',
            colorBgContainer: 'rgba(17, 17, 17, 0.3)',
            selectorBg: 'transparent'
          },
          Table: {
            headerBg: '#191919',
            headerColor: '#fff',
            colorBgContainer: 'transparent',
            borderColor: '#646464',
            cellPaddingBlock: 10,
            headerSortHoverBg: '#24d824',
            headerSortActiveBg: '#24d824',
            headerSplitColor: '#646464',
            expandIconBg: 'transparent',
            stickyScrollBarBg: 'rgba(49, 49, 49,.6)'
          },
          DatePicker: {
            cellActiveWithRangeBg: 'rgba(16,216,36,.3)',
            cellRangeBorderColor: 'white',
            colorBgContainer: 'transparent',
            activeShadow: 'none',
            cellHoverBg: '#0f0'
          }
        }
      }}>
      <App className="h-full">{children}</App>
    </ConfigProvider>
  )
}
export default defineApp({
  rootContainer: (App) => {
    return React.createElement(ThemeProvider, null, App)
  }
})

antd主题配置参见： umi全局前置脚本文件：目录结构 (umijs.org)
运行时配置 (umijs.org)