Vue2 + Ant Design 遮罩进度条实现方法

是的，Vue2 和 Ant Design 都可以在遮罩上显示进度条。首先，你需要引入 Ant Design 的进度条组件，可以使用 `` 组件。然后在需要显示进度条的地方，使用 `` 组件作为遮罩，并在其中嵌套 `` 组件。

下面是一个简单的示例代码：

<template>
  <div>
    <a-button @click="startLoading">开始加载</a-button>
    <a-spin :spinning="loading">
      <a-progress :percent="percent" :status="status"></a-progress>
    </a-spin>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loading: false,
      percent: 0,
      status: 'active'
    };
  },
  methods: {
    startLoading() {
      this.loading = true;
      this.status = 'active';
      this.percent = 0;

      const interval = setInterval(() => {
        this.percent += 10;
        if (this.percent >= 100) {
          clearInterval(interval);
          this.loading = false;
          this.status = 'success';
        }
      }, 1000);
    }
  }
};
</script>

在上面的示例中，点击"开始加载"按钮会触发 `startLoading` 方法，该方法会将 `loading` 设置为 `true`，然后通过 `setInterval` 定时增加 `percent` 的值，当 `percent` 达到 100 时，清除定时器，并将 `loading` 设置为 `false`，将 `status` 设置为 "success"，这样进度条会显示加载完成的状态。

注意：以上只是一个简单的示例，实际使用时，你可能需要根据具体需求进行调整。