How to use the antd.message.loading function in antd

async handleDelete() {
    const CRUD = ajax.CRUD(this.props.tableName);
    const hide = message.loading('正在删除...', 0);
    try {
      const res = await CRUD.delete(this.state.selectedRowKeys);
      hide();
      if (res.success) {
        notification.success({
          message: '删除成功',
          description: `删除${res.data}条数据`,
          duration: 3,
        });

        // 数据变化后, 刷新下表格
        const newData = [];
        const keySet = new Set(this.state.selectedRowKeys);  // array转set
        for (const record of this.state.data) {
          if (!keySet.has(record.key)) {  // 是否是被删除的记录
            newData.push(record);

handleSubmit = (e) => {
    e.preventDefault();  // 这个很重要, 防止跳转
    const hide = message.loading('正在验证...', 0);

    const username = ReactDOM.findDOMNode(this.refs.user).value;
    const password = ReactDOM.findDOMNode(this.refs.pass).value;
    logger.debug('username = %s, password = %s', username, password);

    const button = ReactDOM.findDOMNode(this.refs.button);
    button.setAttribute('disabled', 'true');  // 暂时屏蔽提交按钮, 防止用户重复点击

    // 服务端验证
    ajax.post(`${globalConfig.getAPIPath()}${globalConfig.login.validate}`).type('form').send({
      username,
      password,
    }).end((err, res) => {
      hide();
      logger.debug('login validate return: error %o result %o', err, res);

handleImport = (info) => {
    logger.debug('upload status: %s', info.file.status);
    // 正在导入时显示一个提示信息
    if (info.file.status === 'uploading') {
      if (!this.hideLoading) {
        let hide = message.loading('正在导入...');
        this.hideLoading = hide;
      }
    }
    // 导入完成, 无论成功或失败, 必须给出提示, 并且要用户手动关闭
    else if (info.file.status === 'error') {
      this.hideLoading();
      this.hideLoading = undefined;
      notification.error({
        message: '导入失败',
        description: '文件上传失败, 请联系管理员',
        duration: 0,
      });
    }
    // done的情况下还要判断返回值
    else if (info.file.status === 'done') {
      this.hideLoading();

deleteFolder = async (force = false) => {
    if (!this.state.folderToDelete) {
      return;
    }
    const folder = this.state.folderToDelete;
    const isCurrentFolder = folder.id === this._currentFolder.folder.id;
    const request = new FolderDelete(folder.id, force);
    const hide = message.loading('Deleting folder...', 0);
    await request.fetch();
    hide();
    if (request.error) {
      message.error(request.error, 5);
    } else {
      if (isCurrentFolder) {
        if (this._currentFolder.folder.parentId) {
          this.props.folders.invalidateFolder(this._currentFolder.folder.parentId);
          await this.props.folders.load(this._currentFolder.folder.parentId).fetchIfNeededOrWait();
        } else {
          this.props.pipelinesLibrary.invalidateCache();
          await this.props.pipelinesLibrary.fetchIfNeededOrWait();
        }
        if (this._currentFolder.folder.parentId) {
          this.props.router.push(`/folder/${this._currentFolder.folder.parentId}`);
        } else {

el.attributes['model-id']).map(m => m.attributes['model-id'].value)[0];
    let [target] = this.wdlVisualizer.paper.model.getElements()
      .filter(e => e.attributes.type === 'VisualWorkflow');
    if (modelId) {
      const [model] = this.wdlVisualizer.paper.model.getElements().filter(m => m.id === modelId);
      target = model || target;
    }
    const parts = (e.dataTransfer.getData('dropDataKey') || '').split('_');
    if (target && target.step && parts.length >= 2 && parts[0] === ItemTypes.pipeline) {
      const pipelineId = parts[1];
      if (+pipelineId === +this.props.pipelineId) {
        message.error('You cannot use the same pipeline');
        return;
      }
      let pipelineVersion = parts.slice(2).join('_');
      const hide = message.loading('Fetching pipeline info...', 0);
      const pipelineRequest = this.props.pipelines.getPipeline(pipelineId);
      await pipelineRequest.fetch();
      if (pipelineRequest.error) {
        hide();
        message.error(pipelineRequest.error, 3);
        return;
      } else if (!pipelineVersion &&
        (!pipelineRequest.value.currentVersion || !pipelineRequest.value.currentVersion.name)) {
        hide();
        message.error('Cannot fetch latest version of pipeline', 3);
        return;
      }
      if (!pipelineVersion) {
        pipelineVersion = pipelineRequest.value.currentVersion.name;
      }
      const versionRequest = this.props.pipelines.getConfiguration(pipelineId, pipelineVersion);

sendComment = async () => {
    const hide = message.loading('Sending comment...', 0);
    const request = new IssueCommentSend(this.props.issueId);
    const htmlText = await this.props.issuesRenderer.renderAsync(this.state.newComment, false);
    const attachments = await processUnusedAttachments(this.state.newComment, this.state.newCommentAttachments);
    await request.send({text: this.state.newComment, htmlText, attachments});
    if (request.error) {
      hide();
      message.error(request.error, 5);
    } else {
      await this.props.issueInfo.fetch();
      hide();
      this.setState({
        newComment: null,
        newCommentAttachments: []
      });
    }
  };

actions.swapCommand = ( payload ) => async ( dispatch, getState ) => {
  const hideLoading = message.loading( "Moving record in progress..", 0 );
  try {
    const { sourceInx, targetInx, sourceId, targetId } = payload,
          commands = getCommandsFlat( getState().suite.groups ),
          sourceCommand = commands.find( command => command.id === sourceId ),
          targetCommand = commands.find( command => command.id === targetId ),
          pos = sourceInx >= targetInx ? "before" : "after",
          merge = {
            ...sourceCommand,
            testId: targetCommand.testId,
            groupId: targetCommand.groupId
          };

    dispatch( actions.removeCommand( sourceCommand ) );
    dispatch( actions.insertAdjacentCommand( merge, { [ pos ]: targetId }) );

  } catch ( ex ) {

pauseRun = async (run) => {
    const hide = message.loading('Pausing...', -1);
    const request = new PausePipeline(run.id);
    await request.send({});
    if (request.error) {
      hide();
      message.error(request.error);
    } else {
      this.props.refresh && await this.props.refresh();
      hide();
    }
  };

assignRole = async () => {
    const hide = message.loading('Assigning role to user...', 0);
    const request = new RoleAssign(this.props.role.id, this.state.selectedUser);
    await request.send({});
    hide();
    if (request.error) {
      message.error(request.error, 5);
    } else {
      this.setState({
        selectedUser: null,
        fetchedUsers: [],
        search: null
      }, async () => {
        this.props.roleInfo.fetch();
        await roleModel.refreshAuthenticationInfo(this);
      });
    }
  };