vue中使用v

您所在的位置:网站首页 vue循环列表 vue中使用v

vue中使用v

#vue中使用v| 来源: 网络整理| 查看: 265

问题场景: 在vue的v-for循环中使用的数组数据list中属性不是在data初始化声明的,而是在后端接口数据返回时动态添加的属性,此时在页面dom中绑定失效。

问题描述:在v-for循环中,如果我们在函数中改变了item中的值,在console.log()中查看是修改成功了,但在页面中没有及时刷新改变后的值。

解决方法:使用vue自带的 this.$forceUpdate() 迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件,而不是所有子组件。

循环列表显示/隐藏单独控制实例:

v-for循环列表的动态数据,单独控制每个面板里列表的显示/隐藏切换。

点击循环列表的标题绑定点击事件方法:

toggleShow(item) {   item.isShow = !item.isShow   // 动态绑定失效,强制重新渲染   this.$forceUpdate() }

这里虽然isShow 数据已经更新,但是页面第一次点击却没有响应,使用this.$forceUpdate()  方法强制重新渲染

分享到:微信豆瓣网QQ好友QQ空间新浪微博人人网有道云笔记复制网址

本文固定链接: http://www.webzsky.com/?p=1415 | 蓝戒的博客



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3