为了账号安全,请及时绑定邮箱和手机立即绑定

vue2.0 的渲染列表li中通过控制添加属性的动态v-bind:class不会立即生效

vue2.0 的渲染列表li中通过控制添加属性的动态v-bind:class不会立即生效

江户川乱折腾 2018-11-16 14:15:38
例如代码:第一步:从服务端获取一个数据对象array:[obj,obj,obj],第二步:给每一个子对象添加一个浏览器对象obj:    for(let i = 0; i<array.length; i++){        array[i].myObj = false,    }    添加之后的结果是每一个数组子对象obj中的属性里面就会多了一个自定义的浏览器对象属性:myObj:false第三步:将该属性绑定在html结构上用来控制动态的classhtml:  <ul>      <li v-for='item in array' @click='changeBg(item)'>          <span :class='{'change_bg':item.myObj}'>qwer</span>      </li>  </ul> js:    methods: {        changeBg(item){           item.myObj = true         }    }css:.change_bg  background: red出来的结果就是:每次点击时myobj属性已经改为true,但是需要ul刷新的时候动态的class才会生效,(刷新的时候,不会重新获取ul的数据)。
查看完整描述

1 回答

?
皈依舞

TA贡献1851条经验 获得超3个赞

array[i].myObj = false

改为

this.array.$set(i, {myObj: false})


查看完整回答
反对 回复 2018-12-13
  • 1 回答
  • 0 关注
  • 686 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号