Vue项目报错:Invalid prop: custom validator check failed for prop "percentage".


一、问题:

vue中使用elementui的 Progress 进度条组件报错

二、报错信息如下:

vue.runtime.esm.js:619 [Vue warn]: Invalid prop: custom validator check failed for prop "percentage".

found in

---> <ElProgress> at packages/progress/src/progress.vue
       <AllStoreStatisticsDialog> at src/components/vdialog/dialog/Baomu/AllStoreStatisticsDialog.vue
         <Dialog> at src/components/vdialog/VDialog.vue
           <DialogGroup> at src/components/vdialog/vDialogGroup.vue
             <App> at src/views/SYS/App.vue
               <App> at src/App.vue
                 <Root>

三、原因与解决方案

原始代码如下

<el-progress :percentage="percentage" :color="customColor"></el-progress>

原因:

设置的percentage属性值超过了100,percentage的取值范围是0-100。

解决方案

percentage属性赋值的时候做一个三元运算的判断就可以了,代码如下

<el-progress :percentage="percentage>100?100:percentage" :color="customColor"></el-progress>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM