在 Vue.js 的类中使用三元条件

Question

当百分比达到 57 时，如何编写三元条件来更改此进度条的颜色

这就是进度条代码的设置方式

<div
   class="progress-bar"
    role="progressbar"
    :style="{width:(quoteCount / maxQuotes) * 100 + '%'}"
    aria-valuenow="25"
    aria-valuemin="0"
    aria-valuemax="100">
   {{quoteCount}} / {{maxQuotes}}
 </div>

......................

progress-bar bg-danger所以，我想在达到 75% 时添加课程

Answer 1

您需要访问进度条的值，因此理想情况下您需要v-model访问某些数据值，例如progress. 然后只需：

:class="progress > 75 ? 'bg-danger' : '' "