eleemt 表格中 展示进度条以及 超过一百不显示数字问题

  • 就是百分比为 500% 文字也要展示为500% 进度条为满的情况

  • eleemt 表格中 展示进度条以及 超过一百不显示数字问题 因为数据被后台删了 展示无法展示效果了
    在这里插入图片描述

  • 遇到的问题是 percentage值大于100以后 数字部分渲染出现问题 ----主要依靠 format指定进度条文字内容 ----text-inside文字放在进图条中 ----大于100让进图条为100, :percentage=“scope.row.rate>100? 100 :scope.row.rate”

		<el-table-column align="center" prop="rate" width="200" sortable label="截止今天目标完成率">
		        <template slot-scope="scope">
		          <!-- 遇到的问题是 percentage值大于100以后 数字部分渲染出现问题 主要依靠 format指定进度条文字内容  text-inside文字放在进图条中  ----大于100让进图条为100,:percentage="scope.row.rate>100? 100 :scope.row.rate" -->
		          <el-progress :stroke-width="26" :text-inside="true" :format="_format(scope.row.rate)" :percentage="scope.row.rate>100? 100 :scope.row.rate"></el-progress>
		        </template>
		      </el-table-column>
  • percentage 对数据进行处理 如果大于100 就为100 会解决 element 的数字大过100的错误
    在这里插入图片描述
  • 方法里面 对数据进行处理 指定进度条文字内容
 _format(value) {
      return () => {
        return value + '%'
      }
    },

可以的大家点点关注-总结不易谢谢大家-也可以留言需要哪类的我也可以尝试

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值