Vue+Element-ui实例_el-tooltip 占比横条(可超过100%)

1、直接上效果图

Vue+Element-ui实例_el-tooltip 占比横条(可超过100%)_第1张图片

 2、代码如下

        在占比 <= 100%的时候,显示为蓝灰色。

        在占比 > 100%的时候,显示为蓝红色,红色部分为超出部分

        封装后需要传两个值

                1.percent:20%  百分比

                2.totalNum:2000  总数



3、css样式代码

代码中注释掉的部分是因为占比之间的分割线是否 斜着 显示

你可能感兴趣的:(#,vue,+,element-ui实例,vue.js,前端,javascript)