0
点赞
收藏
分享

微信扫一扫

【React工作记录五十七】添加按钮的两种方式


 

目录

前言

导语

方案1 if判断

方案2 switch

总结

前言

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

导语

项目中添加按钮的两种方式

【React工作记录五十七】添加按钮的两种方式_前端

【React工作记录五十七】添加按钮的两种方式_前端_02编辑

方案1 if判断

const buttonTableList = [];
    if (status == '116237257909008888811254') {
      buttonTableList.push({
        title: '发布',
        type: 'primary',
        buttonKey: 'H701100000001',
        onClick: () => {
          this.publishPopup();
        },
      });
    }
    if (status == '116233111696128888077445') {
      buttonTableList.push({
        title: '关闭',
        type: 'primary',
        buttonKey: 'H701100000003',
        onClick: () => {
          this.closePopup();
        },
      });
    }
    buttonTableList.push(
      {
        title: '新增',
        type: 'primary',
        buttonKey: 'H701100000002',

        onClick: () => {
          openTab(this.props, `/management/frameList/add`);
        },
      }

      // {
      //   title: '发布',
      //   type: 'primary',
      //   onClick: () => {
      //     this.publishPopup();
      //   },
      // },
    );

【React工作记录五十七】添加按钮的两种方式_前端_03

方案2 switch

switch (row.status) {
            case PARTNERS_TOBESIGN_STATUS: //待签约1
              return [
                viewDetail,
                row.freezeStatus != '116291061459328888765442' &&
                row.canContract == '1596682955895718561276'
                  ? handleBySigning
                  : '',
                row.freezeStatus != '116291061459328888765442' ? ownerChange : '',
                row.freezeStatus != '116291061459328888765442' ? specialRelease : '',
              ];
            case PARTNERS_CNECELED_STATUS: //已取消
              return [viewDetail, row.freezeStatus != '116291061459328888765442' ? del : ''];
            case PARTNERS_EFFECTIVE_STATUS: //合作中
              return [
                viewDetail,
                row.freezeStatus != '116291061459328888765442' ? modify : '',
                row.freezeStatus != '116291061459328888765442' ? handleTransferApply : '',
                row.freezeStatus != '116291061459328888765442' ? ownerChange : '',
              ];
            case PARTNERS_FREEZEING_STATUS: //冻结中
              return [viewDetail];
            case PARTNERS_SPECIALRELEASE_STATUS: //特殊放行
              return [
                viewDetail,
                row.freezeStatus != '116291061459328888765442' ? handleBySigning : '',
              ];
            default:
              return [viewDetail];
          }

【React工作记录五十七】添加按钮的两种方式_前端_04

总结

两种方式 都是按照不同的判断生成对应的按钮 我是歌谣 微信公众号关注前端小歌谣


举报

相关推荐

0 条评论