您的位置:首页 > Web前端 > Vue.js

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())

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: