vue2 el-Progress 怎么改选中的样式末尾自定义图片

在Vue 2中，`el-progress`组件是Element UI库中的进度条组件。如果你想更改选中部分（通常是表示加载进度的部分）的样式，并在其末尾添加自定义图片，你可以通过修改它的`success-text`属性以及利用CSS来自定义样式。首先，你需要确保已经导入了Element UI。

<template>
  <div>
    <el-progress :percentage="progressPercent" type="dashboard" :success-text="{ customText: '自定义文字', background: 'url(' + yourCustomImageSrc + ')' }"></el-progress>
  </div>
</template>

<script>
export default {
  data() {
    return {
      progressPercent: 80, // 进度百分比，范围从0到100
      yourCustomImageSrc: 'path/to/your/custom/image.png' // 自定义图片的URL
    };
  }
};
</script>

<style scoped>
.el-progress .success-text-custom {
  background-size: cover; /* 如果你想调整图片大小 */
  position: relative;
  padding-right: 40px; /* 添加额外的空间来容纳图片 */
}

.el-progress .success-text-custom img {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
</style>

在这个例子中，`success-text`是一个对象，你可以设置`customText`字段来改变默认的文字，然后设置`background`字段为你想要的图片URL。同时，我们还添加了一些CSS来定位和显示图片。