vue 虚拟字段,DOM及时更新,双向绑定等问题
2019-03-14 14:28
507 查看
数据的复制最好采用 copyObj()的方法,这样的数据操作起来更单独
this.$nextTick(()=>{ console.log('tttttt') }) this.$set(this.localData, 'visibleCity', 'bc')
上面的两种方法都能触发及时更新,
虚拟字段,
在数组中,也就是table数据源中,可以使用map方法对数据进行复制并添加虚拟字段
fetchList(this.listQuery).then(response => { const items = response.data.items this.list = items.map(v => { this.$set(v, 'edit', false) // https://vuejs.org/v2/guide/reactivity.html v.originalTitle = v.title // will be used when user click the cancel botton return v }) })
在form中虚拟字段,可以使用,也就是操作数据源,
let newObj = copyJsObj(val) 重新生成一个对象 this.$set(newObj, 'aaa', 'bbb') 或 newObj.aaa = 'bbb' 推荐使用第一种,好像是官方推荐的,
在双向绑定问题中,不能实现及时更新的问题
1,不在data中显式声明的对象不能及时更新
2,在form中,经过v-model的变量 或 在其他html标签中 使用v-bing:方法的变量才能及时更新
3,vue不能检测到对象属性的增加,修改,删除, 不能及时触发DOM的更新,需要借用其他的更新,(this.set(),this.set(), this.set(),this.nextTixt())
相关文章推荐
- vue绑定v-modal布尔值到checkbox后异步,部分手机更新不及时问题
- 解决vue中虚拟dom,无法实时更新的问题
- vue 解决input内值的双向绑定问题
- Vue.js 2.0 有时双向绑定img src属性失败问题
- ThinkPHP自动完成更新绑定的字段更新无效的问题
- vue数据绑定数组,改变元素时不更新view问题
- 探讨vue的双向绑定v-model在项目中的条件搜索遇到的问题
- vue解除双向绑定问题
- Silverlight:双向绑定综合应用-自动更新集合汇总字段
- vue自定v-model实现表单数据双向绑定问题
- Vue表单demo v-model双向绑定问题
- Silverlight:双向绑定综合应用-自动更新集合汇总字段
- IOS自带输入法中文不触发KEYUP事件导致vue双向绑定错误问题
- vue中虚拟dom,无法实时更新的解决方案
- 解决Vue.js 2.0 有时双向绑定img src属性失败的问题
- 轻松理解vue的双向数据绑定问题
- VX中解决在绑定数据后没有及时更新的问题
- Vue双向数据绑定 Vue事件介绍 以及Vue中的ref获取dom节点
- js更新dom后页面及时渲染问题(js线程阻塞和解决办法)
- Vue的基础认知二---vue的双向绑定/vue获取DOM节点