ant design table中增加按钮的两种方式

48 阅读1分钟

 

目录

前言

导语

方式1 push

方式二 数组

总结


前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

歌谣 歌谣 ant design中table里面如何增加按钮呢

​编辑

方式1 push

 {
        title: '操作',
        dataIndex: 'operation',
        align: 'center',
        list: (text, row) => {
          let arr = [];
          arr.push({
            name: '修改',
            onClick: () => {
              this.props.handleUpdate(row.lecturerCode);
            },
          });
          if (
            row.status === '1202012241104168888017657' ||
            row.status === '1202012241105288888630417'
          ) {
            arr.push({
              name: '删除',
              isPopConfirm: true,
              btnTxt: '确认删除该讲师吗?',
              onClick: () => {
                this.props.handleDelete([row.lecturerId]);
              },
            });
          }
          return arr;
        },
      },

方式二 数组

 const tagIcon = {
      title: '标签',
      icon: 'plus',
      type: 'primary',
      onClick: () => this.handleAddTag(selectedRowKeys),
    };
    const delIcon = {
      title: '删除',
      isDelete: true,
      icon: 'delete',
      type: 'primary',
      // loading: deleteButtonLoading,
      onClick: () => this.handleDelete(selectedRowKeys),
    };
    const addIcon = {
      title: '新增',
      icon: 'plus',
      type: 'primary',
      onClick: () => this.handleAddLecturer(),
    };
    const uploadIcon = {
      title: '导出',
      icon: 'export',
      type: 'primary',
      href: this.handleExport(),
      // onClick: () => this.handleExport(),
    };
    const buttonList = listType === 'table' ? [addIcon, cardIcon] :
 [addIcon, cardIcon];

总结

本文总结了两种在ant design table中增加按钮的方式 欢迎一起交流讨论