使用element-plus Progress实现：动画100

以下是使用element-plus Progress实现动画100%的示例代码：

<template>
  <div>
    <el-progress :percentage="percentage" :stroke-width="6" :color="'#409EFF'" :text-inside="true"></el-progress>
  </div>
</template>

<script>
import { ref } from 'vue';
import { ElProgress } from 'element-plus';

export default {
  components: {
    ElProgress,
  },
  setup() {
    const percentage = ref(0);

    const animate = () => {
      if (percentage.value < 100) {
        percentage.value += 1;
        setTimeout(animate, 20);
      }
    };

    setTimeout(animate, 1000);

    return {
      percentage,
    };
  },
};
</script>

在这个示例中，我们使用了Vue 3和Element Plus库。我们使用了ElProgress组件来创建进度条。我们使用了percentage变量来跟踪进度条的完成百分比。

我们定义了一个animate函数，该函数每20毫秒增加percentage的值，直到它达到100。我们使用setTimeout函数来定时调用animate函数，以便动画逐步完成。

最后，我们将percentage变量绑定到ElProgress组件的percentage属性中，以便显示进度条的完成百分比。我们还设置了stroke-width属性来定义进度条的宽度，color属性来定义进度条的颜色，并将text-inside属性设置为true，以便在进度条内部显示进度百分比。