element el-progress进度条下放跟随进度展示文字

以我的思路来看这个下方展示文字就是首先能获取到这个进度条的百分比是多少

通过el-progress组件源码我们可以看到content函数来获取到这个进度条的百分比

  content() {
        if (typeof this.format === 'function') {
          return this.format(this.percentage) || '';
        } else {
          return `${this.percentage}%`;
        }
      }

这个时候我们就可以使用ｒｅｆ来进行获取进度百分比，有了进度百分比这个事情就变得比较简单了我们在el-progress组件下方随便写一个盒子给这个盒子的ｌｅｆｔ的值赋值为

我们用ｒｅｆ获取到content函数值，前提他们两个应该有一个更大的盒子来约定这个宽度，然后给下面要跟随进度展示的盒子margin－left就好了，这个时候是盒子的最左端进行了跟随

想要盒子中间去和进度条对齐，直接减去left值就行了。

这个只是本人用的一种方法有更好，更简单的方法欢迎大家讨论、分享