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 ''
          }
 
        }} />
相关推荐
掘金酱几秒前
【10.24 特别活动】AI 时代,程序员的新饭碗在哪里?
前端·人工智能·后端
excel9 分钟前
多进程环境下使用 PM2 部署 Socket.IO:需要注意什么
前端
IT_陈寒23 分钟前
Redis的原子性竟然失效了?记一次分布式锁翻车实录
前端·人工智能·后端
_菜鸟果果2 小时前
高德地图 JS API 2.0 在国产 Linux/ARM 电脑上渲染失败 的排查与解决
linux·开发语言·javascript
时间的情敌2 小时前
《回顾 2018 前端:Vue2 成熟期,Webpack4 发布,PWA 大火》
前端
Java后端的Ai之路2 小时前
前端技术Vue-09-webpack-vuejs-实战
前端·vue.js·webpack
LMT流氓兔2 小时前
第五单元——第4课:给工具参数加校验
java·前端·算法·ai·langchain
涛涛ing3 小时前
React Compiler正式“Rust化”:你项目里的Babel插件,正在被编译进打包器
前端
迷途小羔羊3 小时前
项目概述
java·javascript·后端