在使用VUE的过程中,会遇到这样一种情况, vue data 中的数据更新后,视图没有自动更新。

这个情况一般分为两种,

一种是数组的值改变,在改变数组的值的是时候使用索引值去更改某一项,这样视图不会实时更新

第二种情况是改变了对象的某一项,但是其他依赖这个数据的视图没更新

第一种情况是因为直接通过索引去改变数组,vue 对象监听不到他的变化 所以没有更新。

----解决方法  1. Vue.set(example1.items[0], { childMsg: 'Changed!'})

      2.使用Vue的变异方法 pop() push() shift() unshift() revese() sort() splice() 也会触发视图更新

第二种情况是修改对象的属性,比如父组件和子组件公用一份数据,数据通过props传到子组件,在子组件中修改数据父组件中不会响应。

方案一:利用Vue.set(object,key,val)

例:Vue.set(vm.obj,'k1','v1')

方案二:利用this.$set(this.obj,key,val)

例:this.$set(this.obj,'k1','v1')

方案三:利用Object.assign({},this.obj)创建新对象

方案四:可以先删除掉该项,然后再使用set 去添加

最新文章

  1. 说说DOM的那些事儿
  2. log4jWARN Please initialize the log4j system properly解决办法
  3. javascript 设计模式-----工厂模式
  4. MongoDB 副本集管理(不定时更新)
  5. JSON学习总结
  6. django post分号引发的问题
  7. avoid null value in field
  8. bzoj2285
  9. SQL Server 2008性能故障排查(四)——TempDB
  10. hdu4705 Y 简单树形DP 2013多校训练第十场 J题
  11. 如何查看安装的sql server是什么版本
  12. Redis API的原子性分析
  13. C# 乐观锁、悲观锁、共享锁、排它锁、互斥锁
  14. Win7 VS2015环境使用qt-msvc2015-5.6.0
  15. 还不好好读书吗?清华3D录取通知书出炉,还能动!
  16. 客户端调用wcf服务,如何提高调用性能
  17. kubernetes基础知识:限制POD和容器运行的CPU、内存
  18. iptables应用
  19. android学习一---搭建开发环境
  20. 一个RecycleView的强大adapter

热门文章

  1. C++ IO流_数据的旅行之路
  2. OpenJudge 1.5.28 分离整数的各个数位
  3. 这12款idea插件,能让你代码飞起来
  4. Windows如何创存储虚拟机并制作存储虚拟化LUN的映射
  5. KingbaseES insert all/first 功能介绍
  6. 小结event.target与this
  7. K8S Service_Ingress
  8. Unity2D-Dash && SpeedUp
  9. CMake | 将路径添加到 CMAKE_PREFIX_PATH
  10. VMware Component Manager服务无法启动