vue 倒计时进度条问题

Question

请问vue的倒计时进度条怎么做啊，从后端获取到了倒计时的剩余时间和总时间

<div class="progress_bg" >
   <div class="progress" ></div>
</div>

//已经知道总时间300秒，剩余时间125秒
this.openTime.Seconds = 300
this.openTime.NextSeconds = 125

Answer 1

<div class="progress_bg" >
   <div class="progress" :style="{width:openTime.NextSeconds}"></div>
</div>

再给 progress 加上样式 transition: 0.2s; 就有过渡动画了

Answer 2

.progress_bg width = 100
.progress width 等于 NextSeconds/Seconds

更新state就好了呀

---

了解了这个之后可以用computed计算属性，自动更新progress width，比较优雅些