react的antd表格自定义图标

将原版的加号换成箭头

自定义图标

安装图标包:

npm install --save @ant-design/icons

引入:

javascript 复制代码
import { RightOutlined, DownOutlined } from '@ant-design/icons';

参数是一个函数

javascript 复制代码
 
<Table columns={columns} dataSource={data} indentSize={20}
    expandIcon={({ expanded, onExpand, record }) => {
    //expanded-是否可展开, onExpand-展开事件默认, record-每一项的值 设置自定义图标
    if (record.children && record.children.length != 0) {
         if (expanded) {//根据是否可以展开判断
             return <DownOutlined onClick={e => onExpand(record, e)} />
         } else {
            return <RightOutlined onClick={e => onExpand(record, e)} />
         }
         } else {
            return ''
          }
 
        }} />
相关推荐
yuanlaile4 分钟前
前端转 Flutter 自学完整规划,避开跨栈思维转换误区
前端·flutter·flutter跨平台开发
CN_HW6 分钟前
Nginx 流量镜像配置文档-双轨国产化
服务器·前端·网络
姑苏倾城客7 分钟前
Flutter中,html 与 dart 桥接沟通
javascript·flutter·html
JNX_SEMI21 分钟前
ATR2652 GNSS双频LNA:0.75dB噪声系数与22dB高增益设计
前端·单片机·嵌入式硬件·物联网·硬件工程
拾年27537 分钟前
Node.js 异步进化论:从 path 路径拼接到 fs 文件读取,我终于理解了回调地狱的救赎之路
前端·node.js
花颜yyds1 小时前
React Konva 开发基础速查手册
前端
小粉粉hhh1 小时前
Node.js(五)——编写接口
前端·javascript·node.js
MegatronKing1 小时前
AI时代我们要如何玩抓包测试
前端·后端·测试
uhakadotcom1 小时前
Scrapy-Redis 里面提供哪些即开即用的功能能力模块
前端·面试·github
大意的百合2 小时前
Electron 应用如何上架微软商店:从 MSIX 打包到商店提交
javascript·microsoft·electron