vue 绑定 style 失败

Question

<li :style="{'width': this.liWidth}" v-for="(item,index) in this.lidata" :key="index" @click="selectLi(index, item.carName)">
    <div class="clearfix">
    <h4 class="wrapLine">{{item.carName}}</h4>
    <p class="wrapLine">{{item.address}}</p>
    </div>
</li>

data: function () {
   return {
     liWidth: 190,
     num: 0
}
mounted: function () {
  var self = this
  var listBoxWidth = $('.list-box').width()
  if (listBoxWidth > 996) {
      self.num = 6
  } else {
     self.num = 4
  }
  self.liWidth = listBoxWidth / self.num
}

vue-cli 环境
没有任何报错,只是li的绑定的style的宽度 不渲染

Answer 1

错误在于v-for 里面的 this 指向了 window . 我也不知道为什么,我以为this会永远指向实例的...现在问题解决了,把this去掉就好了

Answer 2

改成<li :style="{'width': liWidth+'px'}"