calc计算进度条时出现的错误

如下图的写法第一句的时候报错了,第二句的时候可以显示出需要的效果

calc里面的内容是计算出来的,precent2,precent分别是进度条的当前值和总值。

效果如下图


代码如下HTML

<div class="zhenProgress"><div class="bar":style="`--precent2: ${item.grade};--precent: ${maxBusiness}`"></div></div>
.zhenProgress {width: 200px;.bar {width: 90%;background-color: rgba(232, 237, 250, 0.9);}.bar::before {display: block;counter-reset: progress var(--precent2);content: counter(progress);//   width: calc(100% * var(--precent2) / var(--precent));width: ~"calc(100% * var(--precent2) / var(--precent))";color: #fff;background-color: rgba(0, 193, 255, 1);text-align: center;white-space: nowrap;}}

查找资料得知在less中计算操作不一样,资料来源calc的~

那么在这当中的区别就是需要calc之前加~,然后后面的代码用引号包起来就解决了。

Cannot read property ‘numerator‘ of undefined,calc的运算相关推荐

  1. chrome浏览器不能录音:Uncaught TypeError: Cannot read property ‘getUserMedia‘ of undefined解决方法

    Uncaught TypeError: Cannot read property 'getUserMedia' of undefined解决方法 javascript 打不开浏览器录音功能的问题解决方 ...

  2. 使用JQuery Validate插件的报Cannot read property 'settings' of undefined错误的解决方法

    一.问题描述: 因为最近在做动态表单,很多字段需要动态添加验证,而我在动态添加删除校验规则时,浏览器经常报Cannot read property 'settings' of undefined,每次 ...

  3. jquery.dataTables.min.js: Uncaught TypeError: Cannot read property 'style' of undefined

    Jquery DataTable使用报这个错: jquery.dataTables.min.js: Uncaught TypeError: Cannot read property 'style' o ...

  4. VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property 'xxxx' of undefined 的解决办法...

    data里面做了定义 在方法里面进行赋值 用 this.info = repos.data 数据可以请求到,但是会报错 TypeError: Cannot set property 'listgrou ...

  5. 记一次前端问题解决历程(Cannot read Property ‘call‘ of undefined)

    记一次前端问题解决历程(Cannot read Property 'call' of undefined) 参考文章: (1)记一次前端问题解决历程(Cannot read Property 'cal ...

  6. vue 报错 Cannot read property ‘__ob__‘ of undefined的解决方法

    vue 报错 Cannot read property '__ob__' of undefined的解决方法 参考文章: (1)vue 报错 Cannot read property '__ob__' ...

  7. 小程序中Cannot read property ‘setData‘ of undefined问题的解决

    小程序中Cannot read property 'setData' of undefined问题的解决 参考文章: (1)小程序中Cannot read property 'setData' of ...

  8. NPM:Cannot read property 'pause' of undefined

    npm ERR! Cannot read property 'pause' of undefined npm ERR! A complete log of this run can be found ...

  9. bug之bootstrap switch Uncaught TypeError: Cannot read property 'apply' of undefined

    2019独角兽企业重金招聘Python工程师标准>>> <input type="checkbox" name="my-switch" ...

最新文章

  1. OpenCV转换PyTorch分类模型并使用OpenCV Python启动
  2. linux系统性能监视高级命令(12个)
  3. 再见了微服务!全面拥抱 DDD 真正的价值
  4. 【No.1 Ionic】基础环境配置
  5. 线性回归 —— python
  6. Python中append()和extend方法的使用和区别
  7. 解决安装MarkupSafe安装 from setuptools import Feature 报错ImportError: cannot import name ‘Feature‘
  8. 用jQuery插件实现“小图点击预览大图”功能1
  9. 财务人毕业三年薪资翻了三倍,学会数据分析竟然这么吃香
  10. 一种基于地图导航的语音识别管理系统的制作方法
  11. B-M求线性移位寄存器
  12. 视频直播产业的下半场,谁会走谁会留?
  13. C# 命名空间中不存在类型或命名空间名System.XXX
  14. 电影周周看——适合新手学习的微信小程序
  15. c语言银行信用卡卡管理系统,自编自导多人多卡信用卡管理系统
  16. 洛谷P2015 二叉苹果树
  17. 应用结构体实现通讯录
  18. 目标识别数据集扩充方法
  19. Debian 9 配置 OpenConnect(兼容Cisco AnyConnect)
  20. 储能电池IEC62619

热门文章

  1. 今天看到一句觉得很牛逼的话与诸君共享
  2. Oracle 数据库12c 新特性总结
  3. 【物联网】思科借助物联网推进工业解决方案全数字化进程
  4. 算法设计——基姆拉尔森计算公式:计算几月几号是星期几
  5. 大前端CPU优化技术--NEON编程优化技巧
  6. 联通项目中的常见术语(BTS、BSC、MSC、VLR、HLR)
  7. php环境下,两种汇率接口,已经测试通过
  8. Creating a universal SNP and small indel variant caller with deep neural networks理解
  9. servlet:共享资源造成的线程冲突
  10. 导航路径规划之四 路径规划概述