Ant-design-vue table expandIcon属性，自定义ICON，及异步加载

原创已于 2022-11-07 15:16:03 修改 · 3.3k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#ant #vue #前端

收录于

于 2021-08-20 14:56:38 首次发布

ant-design-vue 专栏收录该内容

1 篇文章

订阅专栏

这篇博客详细介绍了在React中如何实现一个功能组件，该组件根据展开状态动态显示加号或减号图标。通过点击图标触发onExpand事件，调整记录的状态。组件样式设置确保了图标具有合适的大小、对齐方式和交互效果。

expandIcon: function (props) {
        let icon = 'ant-design:plus-square-outlined';
        if (props.expanded) {
          icon = 'ant-design:minus-square-outlined';
        } else {
          icon = 'ant-design:plus-square-outlined';
        }
        return h(Icon, {
          icon: icon,
          onClick: function (e) {
            props.onExpand(props.record, e);
          },
          style: {
            fontSize: '22px',
            verticalAlign: 'middle',
            cursor: 'pointer',
            margin: '0 10px 3px 0',
          },
        });
      },