React-ant-design关于Modal中Confirm内部中this指向问题

最新推荐文章于 2024-08-19 23:43:06 发布

前端设计诗

最新推荐文章于 2024-08-19 23:43:06 发布

阅读量2.5k

点赞数

分类专栏： # dva-umi2-ant-design-pro

本文链接：https://blog.csdn.net/weixin_45416217/article/details/103781355

版权

dva-umi2-ant-design-pro 专栏收录该内容

41 篇文章 15 订阅

订阅专栏

1、这是官方组件代码,这里需要注意的是
在confirm中，this指向永远在其内部中，这就是容易踩坑的点。

this在confirm内部为undefind

confirm({
    title: 'Do you want to delete these items?',
    content: 'When clicked the OK button, this dialog will be closed after 1 second',
    onOk() {
      return new Promise((resolve, reject) => {
        setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
      }).catch(() => console.log('Oops errors!'));
    },

代码示例

在这里插入图片描述

  deleteTemplate = () => {
    const { dispatch } = this.props;
    const { archivesBookId } = this.state;
    const Newthis = this;
    confirm({
      title: '是否确定删除该报告册模板？',
      okText: '确定',
      cancelText: '取消',
      onOk() {
        dispatch({
          type: 'archivesBookComposition/deleteArchivesBookSGETenant',
          payload: {
            archivesBookId,
          },
        }).then(() => {
          // 删除后重新选择第一个报告册
          Newthis.fetchAllBookList().then(reportList => {
            if (reportList.length > 0) {
              Newthis.setState(
                {
                  archivesBookId: reportList[0].archivesBookId,
                },
                () => {
                  const { archivesBookId: nextId } = this.state;
                  Newthis.handleReportChange(nextId, 0);
                }
              );
            }
          });
        });
      },
      onCancel() {},
    });
  };