目標(biāo)

動(dòng)態(tài)設(shè)置進(jìn)度條寬度

文檔
https://cn.vuejs.org/v2/guide/class-and-style.html#綁定內(nèi)聯(lián)樣式

https://cn.vuejs.org/v2/guide/computed.html

方法一

綁定樣式:style

read_page、total_page是兩個(gè)參數(shù)

<view class="filled" :style="{ width: read_page / total_page * 100 + '%'}"></view>

方法二

注意

• :style= 的方法countWidth后不能加()
• 使用 computed ，不是methods
• return 'width: 20%; height: 30px'，不是return {width: 20%; height: 30px }

<view class="filled" :style="countWidth"></view>

  computed: {
    countWidth: function () {
      return 'width: 20%; height: 30px'
    }
  }

注意：計(jì)算表達(dá)式不能用 80%（會(huì)報(bào)錯(cuò)），要用0.8
錯(cuò)：300 * 80%
對(duì)： 300 * 0.8

參考
https://juejin.im/post/5d5b87bc6fb9a06b1417e651
https://blog.csdn.net/freedomVenly/article/details/80752215
https://segmentfault.com/q/1010000008835283